CALayer显式动画记录

每天被一堆业务逻辑搅来搅去，抽空学习点动画的知识还是很舒心的。虽然平时用到的并不多，但还是简单记录一下。

知识还是要有的，万一哪天用到了呢。

CABasicAnimation

CABasicAnimation *animation = [CABasicAnimation animation];
animation.keyPath = @"backgroundColor";
animation.fromValue = (__bridge id)_colorLayer.backgroundColor;
animation.toValue = (__bridge id)color.CGColor;
[_layer addAnimation:animation forKey:nil];

通过给layer添加CABasicAnimation对象，设置的keyPath就是想要改变的属性，fromValue是动画的开始值，toValue就是动画后对应的属性值。
因为只是设置了动画的开始值和结束值，并没有真正改变layer的属性值，所以动画结束后还是会恢复到初始状态。
为了让layer颜色在动画后不回到原来的值，我们可以在动画结束后设置它的最终值。这需要用到CAAnimation的代理方法。
将animation的代理设为自身，并实现代理方法。

animation.delegate = self;
- (void)animationDidStop:(CABasicAnimation *)anim finished:(BOOL)flag{
    [CATransaction begin];
    [CATransaction setDisableActions:YES];
    _layer.backgroundColor = (__bridge CGColorRef)anim.toValue;
    [CATransaction commit];
}

这样动画结束后图层就不会回到先前的状态了。
查看CABasicAnimation定义，可以看到还有一个byValue

@interface CABasicAnimation : CAPropertyAnimation
@property(nullable, strong) id fromValue;
@property(nullable, strong) id toValue;
@property(nullable, strong) id byValue;

byValue及fromValue和toValue的用法都有详细解释。

fromValue->toValue
both `fromValue' and `toValue' non-nil. Interpolates between `fromValue' and `toValue'.

 fromValue->fromValue + byValue
 `fromValue' and `byValue' non-nil. Interpolates between  `fromValue' and `fromValue' plus `byValue'.

 toValue-byValue->toValue
 `byValue' and `toValue' non-nil. Interpolates between `toValue' minus `byValue' and `toValue'.

fromValue->当前layer对应属性值
`fromValue' non-nil. Interpolates between `fromValue' and the current presentation value of the property.

当前layer对应属性值->toValue
`toValue' non-nil. Interpolates between the layer's current value of the property in the render tree and `toValue'.

当前layer对应属性值->当前layer对应属性值+byValue
 `byValue' non-nil. Interpolates between the layer's current value of the property in the render tree and that plus `byValue'. */

如果同时设置了3个值要保证fromValue+byValue == toValue,不然会很奇怪，动画不知道结束值是toValue还是fromValue+byValue。

CAKeyframeAnimation

CAKeyframeAnimation可以通过设置values数组来控制动画过程中关键帧，像这样：

CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];
animation.keyPath = @"backgroundColor";
animation.duration = 2;
animation.values = @[(__bridge id)[UIColor blueColor].CGColor,
                     (__bridge id)[UIColor redColor].CGColor,
                     (__bridge id)[UIColor greenColor].CGColor,
                     (__bridge id)[UIColor blueColor].CGColor
                     ];
[_layer addAnimation:animation forKey:nil];

也可以通过设置动画的路径path：

//画一个爱心路径
UIBezierPath *bezierPath = [UIBezierPath bezierPath];
[bezierPath moveToPoint:CGPointMake(kScreenWidth/2., 200)];
//通过两个中间控制点画出右半圆
[bezierPath addCurveToPoint:CGPointMake(kScreenWidth/2., 400) controlPoint1:CGPointMake(kScreenWidth/2.+200, 20) controlPoint2:CGPointMake(kScreenWidth/2.+200, 300)];
//通过两个中间控制点画出左半圆
[bezierPath addCurveToPoint:CGPointMake(kScreenWidth/2., 200) controlPoint1:CGPointMake(kScreenWidth/2.-200, 300) controlPoint2:CGPointMake(kScreenWidth/2.-200, 20)];
[bezierPath closePath];

CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];
    animation.keyPath = @"position";
    animation.duration = 4;
    animation.path = bezierPath.CGPath;
    [_layer addAnimation:animation forKey:nil];

这样图层会沿着爱心路线运动。

CAAnimation

过渡动画，可以通过type和subtype设置过渡样式

CATransition *animation = [CATransition animation];
animation.type = @"push"   
animation.subtype = @"fromLeft";
[_layer addAnimation:animation forKey:nil];