iOS:核心动画之关键帧动画CAKeyframeAnimation

CAKeyframeAnimation是iOS核心动画中的一个关键帧动画，它可以根据用户定义的关键帧（指定的一些时间点）来进行动画效果的计算。可以在动画的路径上设置多个关键帧，这样就能够实现更加复杂的动画效果，同时也具有很好的性能表现。

CAKeyframeAnimation的使用

CAKeyframeAnimation的使用和其他的动画类似，主要有以下几个步骤：

1.创建CAKeyframeAnimation对象

```

CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];

```

这里只是创建了一个CAKeyframeAnimation对象，还没有设置任何动画效果。

2.设置动画的属性

CAKeyframeAnimation有很多可以设置的属性，下面是一些比较常用的：

- duration：设置动画的持续时间（秒）

- repeatCount：设置动画重复的次数

- timingFunction：设置动画的时间函数对象，让动画的速度快慢有所变化

- values：设置动画执行的关键帧值，用来描述路径动画。

3.设置动画的路径

CAKeyframeAnimation的路径动画是围绕着一个层（CALayer）进行的，每个关键帧表示该层在路径上的位置。可以设置多个关键帧，以实现复杂的动画效果。具体方法如下：

```

CGMutablePathRef path = CGPathCreateMutable();

CGPathMoveToPoint(path, NULL, 20, 20);

CGPathAddLineToPoint(path, NULL, 300, 300);

CGPathAddLineToPoint(path, NULL, 100, 400);

animation.path = path;

CGPathRelease(path);

```

这里使用CGMutablePathRef来绘制路径，并将其赋值给动画的path属性，path属性值为CGPathRef类型。CGPathAddLineToPoint方法用于添加每个关键帧的位置坐标。

4.将动画添加到层上

```

[self.view.layer addAnimation:animation forKey:@"position"];

```

将动画添加到层上，表示该层上的对象将被动画所改变的属性（动画的keyPath）所影响。最后需要指定键（key）以标识该动画，以便可以稍后检索该动画并进行任何需要的更改或删除操作。

CAKeyframeAnimation的案例

下面是一个简单的示例代码，演示了如何使用CAKeyframeAnimation来制作一个路径动画。该动画从起点(30, 30)移动到终点(300, 400)，并且在同时变色，变大。

```

- (void)viewDidLoad {

[super viewDidLoad];

// 1. 创建shapeLayer图层

CAShapeLayer *animationLayer = [CAShapeLayer layer];

animationLayer.backgroundColor = [UIColor yellowColor].CGColor;

animationLayer.frame = CGRectMake(0, 0, 20, 20);

animationLayer.cornerRadius = 10;

animationLayer.masksToBounds = YES;

animationLayer.position = CGPointMake(30, 30);

[self.view.layer addSublayer:animationLayer];

// 2. 创建路径动画

CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];

// 3. 设置路径

CGMutablePathRef path = CGPathCreateMutable();

CGPathMoveToPoint(path, NULL, 30, 30);

CGPathAddLineToPoint(path, NULL, 300, 400);

pathAnimation.path = path;

CGPathRelease(path);

// 4. 设置动画属性

pathAnimation.duration = 1.5;

pathAnimation.repeatCount = MAXFLOAT;

pathAnimation.rotationMode = kCAAnimationRotateAutoReverse;

// 5. 动画变色

CAKeyframeAnimation *colorAnimation = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];

colorAnimation.values = @[(__bridge id)[UIColor yellowColor].CGColor,

(__bridge id)[UIColor redColor].CGColor,

(__bridge id)[UIColor blueColor].CGColor,

(__bridge id)[UIColor greenColor].CGColor,

(__bridge id)[UIColor yellowColor].CGColor,

];

colorAnimation.keyTimes = @[@0, @0.25, @0.5, @0.75, @1.0];

colorAnimation.duration = 1.5;

colorAnimation.repeatCount = MAXFLOAT;

// 6. 动画变大

CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];

scaleAnimation.fromValue = @1;

scaleAnimation.toValue = @1.5;

scaleAnimation.duration = 1.5;

scaleAnimation.repeatCount = MAXFLOAT;

// 7. 组合动画

CAAnimationGroup *groupAnimation = [CAAnimationGroup animation];

groupAnimation.animations = @[pathAnimation, colorAnimation, scaleAnimation];

groupAnimation.duration = 1.5;

groupAnimation.repeatCount = MAXFLOAT;

// 8. 添加动画到图层

[animationLayer addAnimation:groupAnimation forKey:@"positionColorScale"];

}

```

通过上面的代码，我们可以制作出这样的动画效果：


总结

CAKeyframeAnimation是iOS核心动画中非常有用的一种动画，可用于实现各种复杂的路径动画，同时也具有良好的性能表现。按照上面的步骤和代码示例，可以轻松地使用CAKeyframeAnimation来制作出想要的动画效果。 如果你喜欢我们三七知识分享网站的文章， 欢迎您分享或收藏知识分享网站文章 欢迎您到我们的网站逛逛喔！https://www.37seo.cn/