Search code examples
iphoneipadioscore-animation

iPhone/iPad Spinner to keep animation


I am new to core-animationI am basing this on a previous post: spin image clockwise/anticlockwise on touch

Probably a basic question, but I just want the circle to spin a certain distance and then stop. When the animation ends, it reverts back to the original location.

How do I keep the item to stay where it's at when the animation ends?


What I really want is free floating wheel that responds to user swiping. When the user swipes to the left on the wheel, the wheel spins to the left. Depending on the speed of the swipe, the wheel spins faster and then starts to slow down. If anyone can give some hints or directions on this, I would be greatly appreciative. alt text


Solution

  • This is a common point of confusion with Core Animation. A CAAnimation doesn't actually change the backing "model" properties of the layer. It just changes how the layer appears to the user. So your toValue is never set on your layer, and you need to do it yourself. You can do this right before or after you kick of the animation. Your new value will be set, but the user won't see it until the animation finishes. A contrived example:

    CABasicAnimation *rotate = [CABasicAnimation animationWithKeyPath:@"transform"];
    rotate.fromValue = [NSValue valueWithCATransform3D:myLayer.transform];
    rotate.toValue = [NSValue valueWithCATransform3D:CATransform3DRotate(myLayer.transform, M_PI, 0.f, 0.f, 1.f)];
    rotate.duration = .5f;
    
    myLayer.transform = CATransform3DRotate(myLayer.transform, M_PI, 0.f, 0.f, 1.f);
    [myLayer addAnimation:rotate forKey:@"transform"];
    

    The two important pieces are setting the property on the layer and using the property name as the key in addAnimation:forKey:. Don't worry about the implicit animation. Internally, a CALayer holds all of its animations in a dictionary keyed off of the property names, and when you add a new animation, it cancels and replaces any existing animation for the specified key/property.

    Also, I can't tell if you needed help with the swipe gesture or not, but you should check out UIPanGestureRecognizer if you haven't yet. It provides a handy velocityInView: method which will give you a 2D vector in the direction of the pan expressed in points per second. I have some gesture recognizer sample code up on github that might help.