iOS动画-从UIView到Core Animation

首先，介绍一下UIView相关的动画。

UIView普通动画：

[UIView beginAnimations: context:];[UIView commitAnimations];

动画属性设置：

 1     //动画持续时间
 2     [UIView setAnimationDuration:(NSTimeInterval)];
 3     //动画的代理对象
 4     [UIView setAnimationDelegate:(nullable id)];
 5     //设置动画将开始时代理对象执行的SEL
 6     [UIView setAnimationWillStartSelector:(nullable SEL)];
 7     //设置动画延迟执行的时间
 8     [UIView setAnimationDelay:(NSTimeInterval)];
 9     //设置动画的重复次数
10     [UIView setAnimationRepeatCount:(float)];
11     //设置动画的曲线
12     /*
13      UIViewAnimationCurve的枚举值：
14      UIViewAnimationCurveEaseInOut,         // 慢进慢出（默认值）
15      UIViewAnimationCurveEaseIn,            // 慢进
16      UIViewAnimationCurveEaseOut,           // 慢出
17      UIViewAnimationCurveLinear             // 匀速
18      */
19     [UIView setAnimationCurve:(UIViewAnimationCurve)];
20     //设置是否从当前状态开始播放动画
21     /*假设上一个动画正在播放，且尚未播放完毕，我们将要进行一个新的动画：
22      当为YES时：动画将从上一个动画所在的状态开始播放
23      当为NO时：动画将从上一个动画所指定的最终状态开始播放（此时上一个动画马上结束）*/
24     [UIView setAnimationBeginsFromCurrentState:YES];
25     //设置动画是否继续执行相反的动画
26     [UIView setAnimationRepeatAutoreverses:(BOOL)];
27     //是否禁用动画效果（对象属性依然会被改变，只是没有动画效果）
28     [UIView setAnimationsEnabled:(BOOL)];
29     //设置视图的过渡效果
30     /* 第一个参数：UIViewAnimationTransition的枚举值如下
31      UIViewAnimationTransitionNone,              //不使用动画
32      UIViewAnimationTransitionFlipFromLeft,      //从左向右旋转翻页
33      UIViewAnimationTransitionFlipFromRight,     //从右向左旋转翻页
34      UIViewAnimationTransitionCurlUp,            //从下往上卷曲翻页
35      UIViewAnimationTransitionCurlDown,          //从上往下卷曲翻页
36      第二个参数：需要过渡效果的View
37      第三个参数：是否使用视图缓存，YES：视图在开始和结束时渲染一次；NO：视图在每一帧都渲染*/
38     [UIView setAnimationTransition:(UIViewAnimationTransition) forView:(nonnull UIView *) cache:(BOOL)];

举2个例子：

 1     [UIView beginAnimations:@"xxx" context:nil];
 2     [UIView setAnimationDuration:5];
 3     [UIView setAnimationRepeatCount:MAXFLOAT];
 4     [UIView setAnimationDelegate:self];
 5     [UIView setAnimationDelay:3];
 6     [UIView setAnimationWillStartSelector:@selector(animationWillStart)];
 7     [UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
 8     [UIView setAnimationRepeatAutoreverses:YES];
 9     
10     self.iView.frame = CGRectMake(200, 400, 100, 100);
11     
12     [UIView commitAnimations];

 1     [UIView beginAnimations:@"xxx" context:nil];
 2     [UIView setAnimationDuration:2];
 3     [UIView setAnimationRepeatCount:MAXFLOAT];
 4     [UIView setAnimationDelegate:self];
 5     //[UIView setAnimationDelay:3];
 6     [UIView setAnimationWillStartSelector:@selector(animationWillStart)];
 7     [UIView setAnimationCurve:UIViewAnimationCurveLinear];
 8     //[UIView setAnimationRepeatAutoreverses:YES];
 9     
10     [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.iView cache:YES];
11     
12     [UIView commitAnimations];

2. UIView Block动画

1 [UIView animateWithDuration:(NSTimeInterval)//动画时间
2     animations:^{
3         //执行的动画
4     }];

1 [UIView animateWithDuration:(NSTimeInterval)//动画时间
2                      animations:^{
3         //执行的动画
4     } completion:^(BOOL finished) {
5         //动画结束的回调
6     }];

1 [UIView animateWithDuration:(NSTimeInterval)//动画时间
2                           delay:(NSTimeInterval)//动画延迟时间
3                         options:(UIViewAnimationOptions)//动画过渡效果
4                      animations:^{
5         //执行动画
6     } completion:^(BOOL finished) {
7         //动画结束回调
8     }]

UIViewAnimationOptions的枚举值：

    UIViewAnimationOptionLayoutSubviews            //进行动画时布局子控件UIViewAnimationOptionAllowUserInteraction      //进行动画时允许用户交互UIViewAnimationOptionBeginFromCurrentState     //从当前状态开始动画UIViewAnimationOptionRepeat                    //无限重复执行动画UIViewAnimationOptionAutoreverse               //执行动画回路UIViewAnimationOptionOverrideInheritedDuration //忽略嵌套动画的执行时间设置UIViewAnimationOptionOverrideInheritedCurve    //忽略嵌套动画的曲线设置UIViewAnimationOptionAllowAnimatedContent      //转场：进行动画时重绘视图UIViewAnimationOptionShowHideTransitionViews   //转场：移除（添加和移除图层的）动画效果UIViewAnimationOptionOverrideInheritedOptions  //不继承父动画设置
    UIViewAnimationOptionCurveEaseInOut            //时间曲线，慢进慢出（默认值）UIViewAnimationOptionCurveEaseIn               //时间曲线，慢进UIViewAnimationOptionCurveEaseOut              //时间曲线，慢出UIViewAnimationOptionCurveLinear               //时间曲线，匀速
    UIViewAnimationOptionTransitionNone            //转场，不使用动画UIViewAnimationOptionTransitionFlipFromLeft    //转场，从左向右旋转翻页UIViewAnimationOptionTransitionFlipFromRight   //转场，从右向左旋转翻页UIViewAnimationOptionTransitionCurlUp          //转场，下往上卷曲翻页UIViewAnimationOptionTransitionCurlDown        //转场，从上往下卷曲翻页UIViewAnimationOptionTransitionCrossDissolve   //转场，交叉消失和出现UIViewAnimationOptionTransitionFlipFromTop     //转场，从上向下旋转翻页UIViewAnimationOptionTransitionFlipFromBottom  //转场，从下向上旋转翻页

这3个动画比较简单，不再多做叙述。

Spring动画
ios7.0以后新增了Spring动画(IOS系统动画大部分采用Spring Animation，适用所有可被添加动画效果的属性)

[UIView animateWithDuration:(NSTimeInterval)//动画持续时间delay:(NSTimeInterval)//动画延迟执行的时间usingSpringWithDamping:(CGFloat)//震动效果，范围0~1，数值越小震动效果越明显initialSpringVelocity:(CGFloat)//初始速度，数值越大初始速度越快options:(UIViewAnimationOptions)//动画的过渡效果animations:^{//执行的动画
 }completion:^(BOOL finished) {//动画执行提交后的操作}];

[UIView animateWithDuration:3 delay:0 usingSpringWithDamping:0.2 initialSpringVelocity:5 options:UIViewAnimationOptionRepeat animations:^{self.iView.frame = CGRectMake(200, 400, 100, 100);self.iView.transform = CGAffineTransformRotate(self.iView.transform, M_PI);} completion:^(BOOL finished) {}];

Keyframes动画：

IOS7.0后新增了关键帧动画，支持属性关键帧，不支持路径关键帧[UIView animateKeyframesWithDuration:(NSTimeInterval)//动画持续时间delay:(NSTimeInterval)//动画延迟执行的时间options:(UIViewKeyframeAnimationOptions)//动画的过渡效果animations:^{//执行的关键帧动画
 }completion:^(BOOL finished) {//动画执行提交后的操作}];

Core Animation

CABasicAnimation:

//  常用属性：
    duration：动画的持续时间repeatCount：重复次数，无限循环可以设置HUGE_VALF或者MAXFLOATrepeatDuration：重复时间speed：动画速率，决定动画时间的倍率。当speed为2时，动画时间为设置的duration的1/2。timeOffset：动画时间偏移量。比如设置动画时长为3秒，当设置timeOffset为1.5时，当前动画会从中间位置开始，并在到达指定位置时，走完之前跳过的前半段动画。removedOnCompletion：默认为YES，代表动画执行完毕后就从图层上移除，图形会恢复到动画执行前的状态。如果想让图层保持显示动画执行后的状态，那就设置为NO，不过还要设置fillMode为kCAFillModeForwardsfillMode：决定当前对象在非active时间段的行为。比如动画开始之前或者动画结束之后kCAFillModeRemoved：这个是默认值，也就是说当动画开始前和动画结束后，动画对layer都没有影响，动画结束后，layer会恢复到之前的状态kCAFillModeForwards：当动画结束后，layer会一直保持着动画最后的状态kCAFillModeBackwards：在动画开始前，只需要将动画加入了一个layer，layer便立即进入动画的初始状态并等待动画开始。kCAFillModeBoth：这个其实就是上面两个的合成.动画加入后开始之前，layer便处于动画初始状态，动画结束后layer保持动画最后的状态beginTime：可以用来设置动画延迟执行时间，若想延迟2s，就设置为CACurrentMediaTime()+2，CACurrentMediaTime()为图层的当前时间timingFunction：速度控制函数，控制动画运行的节奏kCAMediaTimingFunctionLinear（线性）：匀速，给你一个相对静态的感觉kCAMediaTimingFunctionEaseIn（渐进）：动画缓慢进入，然后加速离开kCAMediaTimingFunctionEaseOut（渐出）：动画全速进入，然后减速的到达目的地kCAMediaTimingFunctionEaseInEaseOut（渐进渐出）：动画缓慢的进入，中间加速，然后减速的到达目的地。这个是默认的动画行为。delegate：动画代理autoreverses：动画完成后是否以动画形式回到初始值fromValue：keyPath相应属性的初始值toValue：keyPath相应属性的结束值byValue：keyPath相应属性的改变值`fromValue`，`toValue`和`byValue`属性可以用很多种方式来组合，但为了防止冲突，不能一次性同时指定这三个值。例如，如果指定了`fromValue`等于2，`toValue`等于4，`byValue`等于3，那么Core Animation就不知道结果到底是4（`toValue`）还是5（`fromValue + byValue`）了。他们的用法在`CABasicAnimation`头文件中已经描述的很清楚了，所以在这里就不重复了。总的说来，就是只需要指定`toValue`或者`byValue`，剩下的值都可以通过上下文自动计算出来。

实例化方法：

CABasicAnimation *basicAnimation = [CABasicAnimation animationWithKeyPath:@"position"];

其中keyPath表示动画类型，常用的keyPath:

举一个例子：

CABasicAnimation *basicAnimation = [CABasicAnimation animationWithKeyPath:@"position"];
basicAnimation.duration = 5;
basicAnimation.removedOnCompletion = NO;
basicAnimation.fillMode = kCAFillModeForwards;/／ basicAnimation.fromValue = [NSValue valueWithCGPoint:CGPointMake(100, 100)];
basicAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 400)];[self.iView.layer addAnimation:basicAnimation forKey:@"rotation"];

“position”也可以替换成上图其他的值，"fromvalue"/"toValue"/"byValue"要与动画类型'keypath'对应。

CAKeyframeAnimation:关键帧动画

关键帧动画和CABasicAnimation一样是CApropertyAnimation的子类，但是CABasicAnimation只能从一个数值(fromValue)变到另一个数值(toValue)或者添加一个增量数值(byValue)，而CAKeyframeAnimation使用values数组可以设置多个关键帧，同时可以利用path可以进行位置或者锚点的动画操作。

常用属性：

values：关键帧数组对象，里面每一个元素即为一个关键帧，动画会在对应的时间段内，依次执行数组中每一个关键帧的动画。
path：动画路径对象，可以指定一个路径，在执行动画时路径会沿着路径移动，Path在动画中只会影响视图的Position。
keyTimes：设置关键帧对应的时间点，范围：0-1。如果没有设置该属性，则每一帧的时间平分。
timingFunctions：每一帧对应的动画节奏。
rotationMode：动画沿路径旋转方式。例如让一个视图按照一条三次贝塞尔曲线移动，如果rotationMode=kCAAnimationRotateAuto,那么这个视图会沿着曲线的切线移动，而不是直来直去的。如下图所示：

举例：

if (tag == 6) {//使用“values”keyFrameAni = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation"];keyFrameAni.duration = 0.3;keyFrameAni.values = @[@(-(4) / 180.0*M_PI),@((4) / 180.0*M_PI),@(-(4) / 180.0*M_PI)];keyFrameAni.repeatCount=MAXFLOAT;}else if (tag == 7){//使用“path”路径keyFrameAni = [CAKeyframeAnimation animationWithKeyPath:@"position"];UIBezierPath *path = [UIBezierPath bezierPath];[path moveToPoint:_aniLayer.position];[path addCurveToPoint:CGPointMake(300, 500) controlPoint1:CGPointMake(100, 400) controlPoint2:CGPointMake(300, 450)];keyFrameAni.path = path.CGPath;keyFrameAni.duration = 1;
1}[_aniLayer addAnimation:keyFrameAni forKey:@"keyFrameAnimation"];

CASpringAnimation

CASpringAnimation是iOS9才引入的动画类，效果类似于UIView的spring动画，不过比其增加了质量，劲度系数等属性的扩展，继承于CABaseAnimation，用法也很简单：

CASpringAnimation *springAnimation = [CASpringAnimation animationWithKeyPath:@"position"];//质量，影响图层运动时的弹簧惯性，质量越大，弹簧拉伸和压缩的幅度越大springAnimation.mass = 1;//刚度系数(劲度系数/弹性系数)，刚度系数越大，形变产生的力就越大，运动越快springAnimation.stiffness = 10;//阻尼系数，阻止弹簧伸缩的系数，阻尼系数越大，停止越快springAnimation.damping = 3;//初始速率，动画视图的初始速度大小 Defaults to zero//速率为正数时，速度方向与运动方向一致，速率为负数时，速度方向与运动方向相反springAnimation.initialVelocity = 10;//settlingDuration:估算时间 返回弹簧动画到停止时的估算时间，根据当前的动画参数估算springAnimation.duration = springAnimation.settlingDuration;springAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(100, 400, 100, 100)];[self.iView.layer addAnimation:springAnimation forKey:@"spring"];

CATransition:转场动画

CATransition是CAAnimation的子类，用于做转场动画，能够为层提供移出屏幕和移入屏幕的动画效果。iOS比Mac OS X的转场动画效果少一点
UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果
动画属性:(有的属性是具备方向的,详情看下图)
type：动画过渡类型
subtype：动画过渡方向
startProgress：动画起点(在整体动画的百分比)
endProgress：动画终点(在整体动画的百分比)

-(void)transitionAnimation{self.index++;if (self.index>7) {self.index=1;}self.iImageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"%@.jpg",[NSNumber numberWithInteger:self.index]]];CATransition *transition = [CATransition animation];transition.type = @"cube";//transition.subtype = @"fromRight";transition.duration = 2;[self.iImageView.layer addAnimation:transition forKey:nil];
}

这里是以"cube"和"pageCurl"的效果图，就是上面的代码，没有做成gif图，可以想象一下哈！

CAAnimationGroup:动画组

动画组，是CAAnimation的子类，可以保存一组动画对象，将CAAnimationGroup对象加入层后，组中所有动画对象可以同时并发运行

属性说明：
animations：用来保存一组动画对象的NSArray
默认情况下，一组动画对象是同时运行的，也可以通过设置动画对象的beginTime属性来更改动画的开始时间

示例：

CAAnimationGroup *group = [CAAnimationGroup animation];//    创建旋转动画对象CABasicAnimation *retate = [CABasicAnimation animation];//    layer的旋转属性retate.keyPath = @"transform.rotation";//    角度retate.toValue = @(M_PI);//    创建缩放动画对象CABasicAnimation *scale = [CABasicAnimation animation];//    缩放属性scale.keyPath = @"transform.scale";//    缩放比例scale.toValue = @(0.0);//    添加到动画组当中group.animations = @[retate,scale];//           执行动画时间group.duration = 2.0;//    执行完以后不要删除动画group.removedOnCompletion = NO;//          保持最新的状态group.fillMode = kCAFillModeForwards;[self.view.layer addAnimation:group forKey:nil];