Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

UIView animation along a round path?

I need to make my little guy (in a UIIamgeView) jump forward and it has to look natural. I want to know is there a way to do it with CoreAnimation (beginAnimation/commitAnimation)?

I could do it by setting a point in between in the air but the movement looks not natural :P

like image 857
david Avatar asked Mar 31 '10 18:03

david


2 Answers

Reading Brad Larson's post, I ended up with a nice function to make my image follow a circle.

You need to import QuartzCore framework: #import

Here is the code:

// Set up path movement
CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
pathAnimation.calculationMode = kCAAnimationPaced;
pathAnimation.fillMode = kCAFillModeForwards;
pathAnimation.removedOnCompletion = NO;
pathAnimation.repeatCount = INFINITY;
//pathAnimation.rotationMode = @"auto";
pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
pathAnimation.duration = 5.0;

// Create a circle path
CGMutablePathRef curvedPath = CGPathCreateMutable();
CGRect circleContainer = CGRectMake(0, 0, 400, 400); // create a circle from this square, it could be the frame of an UIView
CGPathAddEllipseInRect(curvedPath, NULL, circleContainer);

pathAnimation.path = curvedPath;
CGPathRelease(curvedPath);

[self.imageView.layer addAnimation:pathAnimation forKey:@"myCircleAnimation"];
like image 127
Mickael West Avatar answered Sep 19 '22 15:09

Mickael West


Create a CAKeyframeAnimation and assign a CGPath to its path property.

like image 41
Ole Begemann Avatar answered Sep 19 '22 15:09

Ole Begemann