0

I need to create a rotation animation for a uiimageview. The best analogy I can think of is a picture hanging on a wall. The nail that holds up the picture is placed at the top of the picture.

If I pushed the picture I want to model the slight swinging motion of the picture back and forth until it eventually reverts back its its starting position.

I know I'll first have to start by changing the view's anchor point but I'm unsure how to approach the rest of the problem. I could use CABasicAnimation but I'm guessing that would be ridiculously complex/overkill to get a relatively simple animation.

Any suggestions?

[EDIT]

This answer actually worked for me nicely using blocks :)

Community
  • 1
  • 1
bennythemink
  • 5,096
  • 4
  • 36
  • 54

1 Answers1

3

I don't think it should be too difficult using CABasicAnimation to animate the transform.rotation property and choosing the right timing function. Something along the lines of:

    CABasicAnimation* anim = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
    [anim setToValue:[NSNumber numberWithFloat:startAngle]];
    [anim setFromValue:[NSNumber numberWithDouble:endAngle]];
    [anim setDuration:duration];
    [anim setRepeatCount:count];
    [anim setAutoreverses:YES];
    [anim setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
    [selectedCoverView.layer addAnimation:anim forKey:@"SwingingRotation"];

The key point is choosing the right timing function; if none of the predefined ones are ok, you can define an arbitrary timing function using + (id)functionWithControlPoints:(float)c1x :(float)c1y :(float)c2x :(float)c2y (where the control point define a bezier curve).

sergio
  • 68,819
  • 11
  • 102
  • 123
  • thanks @sergio I'm implementing your suggestion above and its working well except for one thing. Its swinging but it only does a half swing, i.e. the view will swing to one side and back to its original position but it will not swing to the other side. Is there a way to do a complete swing using the above without having to create a second block to animate the swing to the other side? thanks again! – bennythemink Apr 25 '12 at 12:01
  • you are right: add `[anim setRepeatCount:count];` to specify the number of iterations (or `NSUIntegerMax` for as many as possible).. – sergio Apr 25 '12 at 12:13
  • Hey @sergio I probably did not explain myself well enough, sorry. I mean that the view will swing from 0 degrees to (for example) 20 degrees and back again to 0 degrees with the code above. But I need it to swing from 0 degrees to 20 back to 0 then to -20 and finally back to 0 degrees. – bennythemink Apr 25 '12 at 12:23
  • sorry, you could try using `byValue` (i.e., startValue = 0, endValue = 20, byValue = -20 -- but I have no idea what this will bring); otherwise, I think that should be 2 animations... – sergio Apr 25 '12 at 13:26
  • many thanks @sergio I will give that a try otherwise I'll just split it into two animations. – bennythemink Apr 25 '12 at 13:36