以下方法可作為兩步實現(xiàn):
以下方法在自定義view的類里面實現(xiàn),可放在自定義函數(shù)中自行控制觸法絮记。也可放在drawRect或layoutSubviews里面讓view在顯 示時觸法洗做。但推薦放在自定義view中觸發(fā)黎烈,因為這樣才可以做到自行控制巷怜,并保證同時只有一個在運行呢袱,否則會因為view的改變導致重繪姆蘸,導致同時執(zhí)行多 個相同的動畫墩莫,會影響效果和耗費內存。
一》讓view對象沿指定的路徑進行動畫的方法:
以下是指定路徑:
CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
//Set some variables on the animation
pathAnimation.calculationMode = kCAAnimationPaced;
//We want the animation to persist - not so important in this case - but kept for clarity
//If we animated something from left to right - and we wanted it to stay in the new position,
//then we would need these parameters
pathAnimation.fillMode = kCAFillModeForwards;
pathAnimation.removedOnCompletion = NO;
pathAnimation.duration = 10;
//Lets loop continuously for the demonstration
pathAnimation.repeatCount = 10;
//Setup the path for the animation - this is very similar as the code the draw the line
//instead of drawing to the graphics context, instead we draw lines on a CGPathRef
//CGPoint endPoint = CGPointMake(310, 450);
CGMutablePathRef curvedPath = CGPathCreateMutable();
CGPathMoveToPoint(curvedPath, NULL, 10, 10);
CGPathAddQuadCurveToPoint(curvedPath, NULL, 10, 450, 310, 450);
CGPathAddQuadCurveToPoint(curvedPath, NULL, 310, 10, 10, 10);
//Now we have the path, we tell the animation we want to use this path - then we release the path
pathAnimation.path = curvedPath;
CGPathRelease(curvedPath);
在指定路徑后逞敷,指定動畫的對象狂秦,(在此用UIImageView舉例:)
UIImageView *circleView = [[UIImageView alloc] initWithImage:circle];
circleView.frame = CGRectMake(1, 1, 40, 40);
[self addSubview:circleView];
//Add the animation to the circleView - once you add the animation to the layer, the animation starts
[circleView.layer addAnimation:pathAnimation
forKey:@"moveTheSquare"];
二>.若要把指定的路徑以線條或其他方法顯示出來,則要繪制路徑推捐,方法是:
UIGraphicsBeginImageContext(CGSizeMake(320,460));
CGContextRef ctx = UIGraphicsGetCurrentContext();
//Set variables in the context for drawing
CGContextSetLineWidth(ctx, 1.5);
CGContextSetStrokeColorWithColor(ctx, [UIColor whiteColor].CGColor);
//Set the start point of your drawing
CGContextMoveToPoint(ctx, 10, 10);
//The end point of the line is 310,450 .... i'm also setting a reference point of 10,450
//A quadratic bezier curve is drawn using these coordinates - experiment and see the results.
CGContextAddQuadCurveToPoint(ctx, 10, 450, 310, 450);
//Add another curve, the opposite of the above - finishing back where we started
CGContextAddQuadCurveToPoint(ctx, 310, 10, 10, 10);
//Draw the line
CGContextDrawPath(ctx, kCGPathStroke);
若要繪制圖片背景(直接添加即可)裂问,則:
//With the image, we need a UIImageView
UIImage *image = [UIImage imagewithName:@"a.png"];
UIImageView *curveView = [[UIImageView alloc] image];
//Set the frame of the view - which is used to position it when we add it to our current UIView
curveView.frame = CGRectMake(1, 1, 320, 460);
curveView.backgroundColor = [UIColor greenColor];
[self addSubview:curveView];