Search code examples
ioscsscore-animationcss-transitionsbezier

Animation easing / iOS animation vs. CSS3 cubic bezier


Trying to ease my animation in some iOS app I'm working on.

Experienced a lot with CSS3 animation and transitions, I'd like to define my animations in iOS as accurately as what would be feasable in CSS3 (as shown here for CSS3 for example http://www.roblaplaca.com/examples/bezierBuilder/ )

If I compare facebook or youtube's sideswipe menus, or even the the one from Path; the way their opening is animated is not the same. That's the kind of animation's customization I'm looking for

Where should I begin for this in iOS ? Any help appreciated


Solution

  • You can define the control points of your own timing function like this:

    myAnimation.timingFunction = [CAMediaTimingFunction functionWithControlPoints:x1 
                                                                                 :y1 
                                                                                 :x2 
                                                                                 :y2];
    

    It works exactly like the bezierBuilder that you linked to in your question.

    If you are unfamiliar with Core Animation I would recommend reading the Core Animation Programming Guide. It's really good.