简单Core Animation

• 常见的UIView，UIButton，UILabel等控件都是封装在UIKit里面，而CoreAnimation里面封装的是更加底层的动画，其作用于CALayer层。
• 使用CoreAnimation最大的好处就是我们可以直接控制控件的属性。
• CAAnimation是所有类的父类，但不能直接使用，只能使用其子类，主要有4个子类，类的结构图如下（其常见属性可以查API…）：

代码如下：

#import "ViewController.h"@interface ViewController ()@property (weak, nonatomic) IBOutlet UIImageView *myImage;@property(nonatomic ,strong)CALayer *myLayer ;@property(nonatomic,assign)int indexImg ;@end@implementation ViewController- (void)viewDidLoad{    [super viewDidLoad];    //创建layer    CALayer *myLayer=[CALayer layer];    //设置layer的属性    myLayer.bounds=CGRectMake(0, 0, 50, 80);    myLayer.backgroundColor=[UIColor yellowColor].CGColor;    myLayer.position=CGPointMake(50, 50);    myLayer.anchorPoint=CGPointMake(0, 0);    myLayer.cornerRadius=20;    //添加layer    [self.view.layer addSublayer:myLayer];    self.myLayer=myLayer;    //开启基本动画//    [self setCABasicAnimation] ;    //开启关键帧动画//    [self setCAKeyFrameAnimation] ;//      开启过渡动画   // self.indexImg = 1 ;    //开启动画组    [self setCAAnimationGroup] ;}//CABaseAnimation设置基本动画/*    －－－－－－－－fillMode属性详解：－－－－－－－－－ 前提：需要将其removedOnCompletion设置为NO...->表示动画结束后不会移除layer.... kCAFillModeRemoved 这个是默认值,也就是说当动画开始前和动画结束后,动画对layer都没有影响,动画结束后,layer会恢复到之前的状态 kCAFillModeForwards 当动画结束后,layer会一直保持着动画最后的状态 kCAFillModeBackwards 这个和kCAFillModeForwards是相对的,就是在动画开始前,你只要将动画加入了一个layer,layer便立即进入动画的初始状态并等待动画开始.你可以这样设定测试代码,将一个动画加入一个layer的时候延迟5秒执行.然后就会发现在动画没有开始的时候,只要动画被加入了layer,layer便处于动画初始状态 kCAFillModeBoth 理解了上面两个,这个就很好理解了,这个其实就是上面两个的合成.动画加入后开始之前,layer便处于动画初始状态,动画结束后layer保持动画最后的状态. */-(void)setCABasicAnimation{    //1.创建CAAnimation动画类    CABasicAnimation *firstAnimation = [CABasicAnimation animation] ;    //2.设置CAAnimation的keypath   //猜想：keyPath利用类似KVO机制监听该动画所要执行的属性    firstAnimation.keyPath = @"transform" ;    //3.设置fromValue的值和toValue的值，表示keyPath属性值从fromValue变成toValue,多个toValue时按照最后一个为标准    /*    firstAnimation.fromValue = [NSValue valueWithCGPoint:CGPointMake(10, 100)] ;//    firstAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(320, 200)] ;    firstAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(320, 400)] ;    */    //CATransform3DMakeRotation该方法为‘3d旋转’，    // M_PI:旋转的度数 ，x,y,z,分别表示在x，y，z轴旋转，1表示旋转，0不旋转    firstAnimation.toValue=[NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 1, 0, 0)];    //4.设置动画时间，重复次数，是否移除,动画执行后的状态等属性    firstAnimation.duration = 1 ;    firstAnimation.repeatCount = MAXFLOAT ;    firstAnimation.removedOnCompletion = NO ;    firstAnimation.fillMode = kCAFillModeForwards ; // 动画结束后不移除，并且保持执行前的状态    //5.执行动画    [self.myLayer addAnimation:firstAnimation forKey:nil] ;}//设置关键帧动画(特别属性：values,path,keytimes,timingFunction)/*  －－－－－－－－－keytimes,timingFunction的区别－－－－－－－－－ －－keytimes : keyframe有n个value就有多少个keytimes，表示每个value所需要的时间（后面补充） －－timingFunction : 有n个value就有n－1个function， 设置keytimes,取值为0-1（不设置的话默认为平分） 属性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。 */-(void)setCAKeyFrameAnimation{    CAKeyframeAnimation *secondAnimation = [CAKeyframeAnimation animation] ;    //设置keyPath----------对比CABaseAnimation新增的    secondAnimation.keyPath = @"position" ;    //设置values (或者可以设置path属性（二者只能去一个，values比较灵活），下篇博文),表示每一帧的动画路径，    secondAnimation.values = @[[NSValue valueWithCGPoint:CGPointMake(0, 100)],                               [NSValue valueWithCGPoint:CGPointMake(200, 100)],                               [NSValue valueWithCGPoint:CGPointMake(200, 400)],                               [NSValue valueWithCGPoint:CGPointMake(50, 400)]] ;    //设置其它属性    secondAnimation.duration = 5 ;    secondAnimation.removedOnCompletion = YES ;    secondAnimation.repeatCount = MAXFLOAT ;    secondAnimation.fillMode = kCAFillModeForwards ;    [secondAnimation setKeyTimes:@[[NSNumber numberWithFloat:0.0],                                    [NSNumber numberWithFloat:0.25],                                   [NSNumber numberWithFloat:0.5],                                   [NSNumber numberWithFloat:1.0]]] ;     secondAnimation.calculationMode = kCAAnimationLinear ;    //执行动画    [self.myLayer addAnimation:secondAnimation forKey:nil] ;}//CATransition 转场动画，用来实现过渡效果，是CAAnimation的子类//特别属性：type（类似keypath),subtype(出现的方向),startprogress（动画在第几秒开始），endprogress，-(void)setCATransitionAnimation{    CATransition *transition = [CATransition animation] ;    transition.type = @"cube" ; //立体翻转效果//    transition.type = kCATransitionMoveIn ;    transition.duration = 2 ;    transition.subtype = @"fromLeft" ;//    transition.subtype = kCATransitionFromTop ;    transition.startProgress = 0 ;//    transition.repeatCount = 1 ;(默认为1)    transition.removedOnCompletion = NO ;    transition.fillMode = kCAFillModeForwards ;    [self.myImage.layer addAnimation:transition forKey:nil];}//CATransition 转场动画的按钮- (IBAction)preAction:(id)sender {    if(self.indexImg >= 2){        self.indexImg -- ;        [self setCATransitionAnimation] ;        self.myImage = (id)[self.myImage initWithImage:[UIImage imageNamed:[NSString stringWithFormat:@"%d.png",self.indexImg]]] ;    }}- (IBAction)nextAction:(id)sender {    if(self.indexImg <= 1){        self.indexImg ++ ;        [self setCATransitionAnimation] ;        self.myImage = (id)[self.myImage initWithImage:[UIImage imageNamed:[NSString stringWithFormat:@"%d.png",self.indexImg]]] ;    }}//CAAnimationGroup组动画，将所有动画组合在一起//animations属性（参数为NSArray,可以初始化）,记录所有的动画-(void)setCAAnimationGroup{   // CAAnimationGroup *animationGroup = [CAAnimationGroup animation] ;    CABasicAnimation *ab1 = [CABasicAnimation animationWithKeyPath:@"transform.scale"] ;    ab1.toValue = @(0.5) ;    ab1.repeatCount = MAXFLOAT ;    CAKeyframeAnimation *ka1 = [CAKeyframeAnimation animationWithKeyPath:@"position"] ;    ka1.values = @[[NSValue valueWithCGPoint:CGPointMake(25, 25)],                   [NSValue valueWithCGPoint:CGPointMake(225, 25)],                   [NSValue valueWithCGPoint:CGPointMake(225, 225)],                    [NSValue valueWithCGPoint:CGPointMake(25, 225)],                   [NSValue valueWithCGPoint:CGPointMake(25, 25)]                   ] ;    ka1.repeatCount = MAXFLOAT ;    CAAnimationGroup *aniGroup = [CAAnimationGroup animation] ;    aniGroup.animations = @[ab1,ka1] ;    aniGroup.duration = 2 ; //    aniGroup.repeatCount = MAXFLOAT ; //    [self.myImage.layer addAnimation:aniGroup forKey:nil] ;}@end/* －－－－－补充－－－－－ -------------------animationWithKeyPath的值--------------- transform.scale = 比例轉換 transform.scale.x = 闊的比例轉換 transform.scale.y = 高的比例轉換 transform.rotation.z = 平面圖的旋轉 opacity = 透明度 margin zPosition backgroundColor    背景颜色 cornerRadius    圆角 borderWidth bounds contents contentsRect cornerRadius frame hidden mask masksToBounds opacity position shadowColor shadowOffset shadowOpacity shadowRadius-----------------timingFunction---------------- kCAMediaTimingFunctionLinear, kCAMediaTimingFunctionEaseIn, kCAMediaTimingFunctionEaseOut, kCAMediaTimingFunctionEaseInEaseOut, kCAMediaTimingFunctionDefault. ----------------calculationMode---------------- kCAAnimationLinear calculationMode的默认值,表示当关键帧为座标点的时候,关键帧之间直接直线相连进行插值计算; kCAAnimationDiscrete 离散的,就是不进行插值计算,所有关键帧直接逐个进行显示; kCAAnimationPaced 使得动画均匀进行,而不是按keyTimes设置的或者按关键帧平分时间,此时keyTimes和timingFunctions无效; kCAAnimationCubic 对关键帧为座标点的关键帧进行圆滑曲线相连后插值计算,对于曲线的形状还可以通过tensionValues,continuityValues,biasValues来进行调整自定义,这里的数学原理是Kochanek–Bartels spline,这里的主要目的是使得运行的轨迹变得圆滑; kCAAnimationCubicPaced 看这个名字就知道和kCAAnimationCubic有一定联系,其实就是在kCAAnimationCubic的基础上使得动画运行变得均匀,就是系统时间内运动的距离相同,*/

程序运行效果图：