CAKeyframeAnimation 关键帧动画

CAKeyframeAnimation 关键帧动画

之所以叫做关键帧动画是因为，这个类可以实现，某一属性按照一串的数值进行动画，就好像制作动画的时候一帧一帧的制作一样。

一般使用的时候  首先通过 animationWithKeyPath 方法创建一个CAKeyframeAnimation实例，

 

CAKeyframeAnimation 的一些比较重要的属性

1. path

这是一个 CGPathRef  对象，默认是空的，当我们创建好CAKeyframeAnimation的实例的时候，可以通过制定一个自己定义的path来让  某一个物体按照这个路径进行动画。这个值默认是nil  当其被设定的时候  values  这个属性就被覆盖 

2. values

一个数组，提供了一组关键帧的值，  当使用path的时候 values的值自动被忽略。

下面是一个简单的例子  效果为动画的连续移动一个block到不同的位置

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

CGMutablePathRef  path = CGPathCreateMutable();     //将路径的起点定位到   （50  120）       CGPathMoveToPoint(path,NULL,50.0,120.0);     //下面5行添加5条直线的路径到path中     CGPathAddLineToPoint(path,  NULL, 60, 130);     CGPathAddLineToPoint(path,  NULL, 70, 140);     CGPathAddLineToPoint(path,  NULL, 80, 150);     CGPathAddLineToPoint(path,  NULL, 90, 160);     CGPathAddLineToPoint(path,  NULL, 100, 170);     //下面四行添加四条曲线路径到path     CGPathAddCurveToPoint(path,NULL,50.0,275.0,150.0,275.0,70.0,120.0);     CGPathAddCurveToPoint(path,NULL,150.0,275.0,250.0,275.0,90.0,120.0);     CGPathAddCurveToPoint(path,NULL,250.0,275.0,350.0,275.0,110.0,120.0);     CGPathAddCurveToPoint(path,NULL,350.0,275.0,450.0,275.0,130.0,120.0);     //以“position”为关键字  创建实例     CAKeyframeAnimation  *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];     //设置path属性     [animation  setPath:path];     [animation  setDuration:3.0];     //这句代码  表示是否动画回到原位    //  [animation setAutoreverses:YES];     CFRelease(path);     [self.block.layer  addAnimation:animation forKey:NULL];

 运行后  block会先沿着直线移动，之后再沿着设定的曲线移动，完全按照我们设定的“关键帧”移动。

下面一个例子是利用values制作的动画

?

1 2 3 4 5 6 7 8 9 10 11

CGPoint  p1=CGPointMake(50, 120);     CGPoint  p2=CGPointMake(80, 170);     CGPoint  p3=CGPointMake(30, 100);     CGPoint  p4=CGPointMake(100, 190);     CGPoint  p5=CGPointMake(200, 10);     NSArray  *values=[NSArray arrayWithObjects:[NSValue valueWithCGPoint:p1],[NSValue valueWithCGPoint:p2],[NSValue valueWithCGPoint:p3],[NSValue valueWithCGPoint:p4],[NSValue valueWithCGPoint:p5], nil];     CAKeyframeAnimation     *animation  = [CAKeyframeAnimation animationWithKeyPath:@"position"];  [animation setValues:values];     [animation  setDuration:3.0];     [animation  setAutoreverses:YES];     [self.block.layer  addAnimation:animation forKey:NULL];

 也非常简单，到目前位置，只用到了CAKeyframeAnimation的两个关键属性就能完成动画，下面的一些属性提供了更加细致化，更加强大的功能。

 

设定每一帧的时间

默认情况下,一帧动画的播放,分割的时间是动画的总时间除以帧数减去一。你可以通过下面的公式决定每帧动画的时间:总时间/(总帧数-1)。例如,如果你指定了一个 5帧,10 秒的动画,那么每帧的时间就是 2.5秒钟:10/(5-1)=2.5。你可以做更多的控制通过使用 keyTimes 关键字,你可以给每帧动画指定总时间之内的某个时间点。 

通过设置属性keyTimes，能实现这个功能，这个属性是一个数组，其成员必须是NSNumber。

同时 这个属性的设定值要与calculationMode属性相结合，同时他们有一定的规则，

The appropriate values in the keyTimes array are dependent on the calculationMode property.

• If the calculationMode is set to kCAAnimationLinear, the first value in the array must be 0.0 and the last value must be 1.0. Values are interpolated between the specified key times.
• If the calculationMode is set to kCAAnimationDiscrete, the first value in the array must be 0.0.
• If the calculationMode is set to kCAAnimationPaced or kCAAnimationCubicPaced, the keyTimes array is ignored。

如果keyTimes的值不合法，或者不符合上面的规则，那么就会被忽略。

?

1 2 3 4 5

[animation  setCalculationMode:kCAAnimationLinear]; [animation setKeyTimes: [NSArray  arrayWithObjects: [NSNumber  numberWithFloat:0.0], [NSNumber  numberWithFloat:0.25], [NSNumber numberWithFloat:0.50], [NSNumber  numberWithFloat:0.75], [NSNumber numberWithFloat:1.0], nil]];

 

calculationMode

这个属性用来设定 关键帧中间的值是怎么被计算的

可选的值有

NSString * const kCAAnimationLinear;

NSString * const kCAAnimationDiscrete;   只展示关键帧的状态，没有中间过程，没有动画。

NSString * const kCAAnimationPaced;

NSString * const kCAAnimationCubic;

NSString * const kCAAnimationCubicPaced;

关键帧动画的基础步骤

1.决定你想要做动画的属性(例如,框架,背景,锚点,位置,边框,等等) 2.在动画对象值的区域中,指定开始,结束,和中间的值。这些都是你的关键帧(看清单 4-2)
3.使用 duration 这个字段指定动画的时间
4.通常来讲,通过使用 times这个字段,来给每帧动画指定一个时间。如果你没有指定这些,核心动画就

会通过你在 values 这个字段指定的值分割出时间段。
5.通常,指定时间功能来控制步调。这些都是你需要做的。你创建你的动画和增加他们到层中。调用-addAnimation就开始了动画。