核心动画

CALayer

CALayer负责视图中显示内容和动画
UIView负责监听和响应事件。在创建UIView对象时，UIView内部会自动创建一个图层（CALayer对象），通过UIView的layer属性可以访问这个层。
当UIView需要显示到屏幕上时，会调用drawRect：方法进行绘图，并且会将所有内容绘制在自己的图层上，绘图完毕后，系统会将图层拷贝到屏幕上，于是就完成UIView的显示。
每一个UIView内部都默认关联着一个CALayer，我们可称这个Layer为Root Layer（根层）。所有的非Root Layer，也就是手动创建的CALayer对象，都存在着隐式动画
CALayer是定义在QuartzCore框架中的
CGImageRef、CGColorRef两种数据类型是定义在CoreGraphics框架中的
UIColor、UIImage是定义在UIKit框架中的
QuartzCore框架和CoreGraphics框架是可以跨平台使用的，在iOS和Mac OS X上都能使用（C 语言编写）。但是UIKit只能在iOS中使用（Objective-C）
为了保证可移植性，QuartzCore不能使用UIImage、UIColor，只能使用CGImageRef、CGColorRef 导入其他框架的方式: 选中项目, 在 General中找 Linked Frameworks and Libraries添加对应的框架

什么是隐式动画？

当对非Root Layer的部分属性进行修改时，默认会自动产生一些动画效果而这些属性称为Animatable Properties(可动画属性)
列举几个常见的Animatable Properties：
bounds：用于设置CALayer的宽度和高度。修改这个属性会产生缩放动画
backgroundColor：用于设置CALayer的背景色。修改这个属性会产生背景色的渐变动画
position：用于设置CALayer的位置。修改这个属性会产生平移动画

可通过动画事务CATransaction关闭默认的隐式动画效果

[CATransaction begin];
[CATransaction setDisableActions:YES];
self.myView.layer.position = CGPointMake(10, 10);
[CATransaction commit];

UIView和CALayer的选择

通过CALayer，就能做出跟UIImageView一样的界面效果

既然CALayer和UIView都能实现相同的显示效果，那究竟该选择谁好呢？

其实，对比CALayer，UIView多了一个事件处理的功能。也就是说，CALayer不能处理用户的触摸事件，而UIView可以。所以，如果显示出来的东西需要跟用户进行交互的话，用UIView；如果不需要跟用户进行交互，用UIView或者CALayer都可以当然，CALayer的性能会高一些，因为它少了事件处理的功能，更加轻量级

注：UIView本身不具备显示的功能，是它内部的层才有显示功能。

- (void)viewDidLoad{
   [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

   UIView* redView = [[UIView alloc] init];

   redView.frame = CGRectMake(100, 100, 100, 100);

   redView.backgroundColor = [UIColor redColor];

   [self.view addSubview:redView];

   // 1>边框
   redView.layer.borderWidth = 10; // 边框的宽度

   redView.layer.borderColor = [UIColor whiteColor].CGColor; // 边框的颜色

   // 2>阴影
   redView.layer.shadowOffset = CGSizeMake(50, 50); // 偏移量  

   redView.layer.shadowColor = [UIColor blueColor].CGColor; // 颜色

   redView.layer.shadowOpacity = 1; // 透明度 (如果要显示 一定要加)

   redView.layer.shadowRadius = 50; // 阴影的圆角半径

   // 3>圆角
   redView.layer.cornerRadius = 50;

   redView.layer.masksToBounds = YES;

  // 4>bounds

  redView.layer.bounds = CGRectMake(0, 0, 200, 200);

  // 5>postion属性和view.center的关系 默认

  redView.layer.position = CGPointMake(100, 100);

  // 6>设置内容(图片)

   redView.layer.contents = (__bridge id)([UIImage imageNamed:@"me"].CGImage);
}

CALayer的transform属性

// 旋转 
self.layer.transform = CATransform3DRotate(self.layer.transform, M_PI_4, 0, 0, 1); 

// 缩放  z轴无效果 
self.layer.transform = CATransform3DScale(self.layer.transform, 1, 1, 0.5); 
// 平移 z轴无效果 
self.layer.transform = CATransform3DTranslate(self.layer.transform, 0, 0, 10);

核心动画

Core Animation：核心动画，是一组非常强大的动画处理API。
Core Animation的动画执行过程是在后台执行的，不会阻塞主线程。Core Animation是直接作用在CALayer上的，并非UIView。

使用步骤：
1、创建动画对象
2、设置动画属性
3、把动画对象添加到某个CALayer对象上
4、需要停止动画：可以调用remove方法移除动画

CAAnimation是所有动画对象的父类，负责控制动画的持续时间和速度，是个抽象类，不能直接使用，应该使用它具体的子类.
属性解析：(红色代表来自CAMediaTiming协议的属性)

duration：动画的持续时间

repeatCount：动画的重复次数

repeatDuration：动画的重复时间

removedOnCompletion：默认为YES，代表动画执行完毕后就从图层上移除，图形会恢复到动画执行前的状态。如果想让图层保持显示动画执行后的状态，那就设置为NO，不过还要设置fillMode为kCAFillModeForwards

fillMode：决定当前对象在非active时间段的行为.比如动画开始之前,动画结束之后

beginTime：可以用来设置动画延迟执行时间，若想延迟2s，就设置为CACurrentMediaTime()+2，CACurrentMediaTime()为图层的当前时间。

timingFunction：速度控制函数，控制动画运行的节奏

基础动画（CABasicAnimation）

CAPropertyAnimation的子类

属性解析:
fromValue：keyPath相应属性的初始值
toValue：keyPath相应属性的结束值
随着动画的进行，在长度为duration的持续时间内，keyPath相应属性的值从fromValue渐渐地变为toValue

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic, weak) CALayer* layer;

@end

@implementation ViewController

- (void)viewDidLoad{ 

    [super viewDidLoad]; 

   // Do any additional setup after loading the view, typically from a nib. 

     UIView* redView = [[UIView alloc] init];

     redView.backgroundColor = [UIColor redColor]; 

     redView.frame = CGRectMake(100, 100, 100, 100); 

     [self.view addSubview:redView]; 

     self.layer = redView.layer;
}

- (void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event{ 

      // *1.基本动画 

      // 1.创建动画对象
      CABasicAnimation* anim = [[CABasicAnimation alloc] init]; 
 
      // 2.操作 
      anim.keyPath = @"position.x"; 

      // anim.fromValue = @(10); // 从哪 

      // anim.toValue = @(300); // 到哪 

      anim.byValue = @(10); // 在自身的基础上累加 

      // 不希望核心动画回到原来的位置 

      anim.fillMode = kCAFillModeForwards; 
    
      anim.removedOnCompletion = NO; 

     // 3.添加动画
     [self.layer addAnimation:anim forKey:nil];
}
@end

关键帧动画（CAKeyframeAnimation）

CApropertyAnimation的子类
跟CABasicAnimation的区别是：CABasicAnimation只能从一个数值(fromValue)变到另一个数值(toValue)，而CAKeyframeAnimation会使用一个NSArray保存这些数值
属性解析：

values：就是上述的NSArray对象。里面的元素称为”关键帧”(keyframe)。动画对象会在指定的时间(duration)内，依次显示values数组中的每一个关键帧

path：可以设置一个CGPathRef\CGMutablePathRef,让层跟着路径移动。path只对CALayer的anchorPoint和position起作用。如果你设置了path，那么values将被忽略

keyTimes：可以为对应的关键帧指定对应的时间点,其取值范围为0到1.0,keyTimes中的每一个时间值都对应values中的每一帧.当keyTimes没有设置的时候,各个关键帧的时间是平分的

CABasicAnimation可看做是最多只有2个关键帧的CAKeyframeAnimation

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic, weak) CALayer* layer;

@end

@implementation ViewController

- (void)viewDidLoad{ 
    [super viewDidLoad]; 
    // Do any additional setup after loading the view, typically from a nib. 

    UIView* redView = [[UIView alloc] init]; 

    redView.backgroundColor = [UIColor redColor]; 

    redView.frame = CGRectMake(100, 100, 20, 20); 
   
    [self.view addSubview:redView]; 

    self.layer = redView.layer;
}

- (void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event{ 

    // 1.创建动画对象 
    CAKeyframeAnimation* anim = [[CAKeyframeAnimation alloc] init]; 

    // 2.操作
    anim.keyPath = @"position"; 

    // 创建一个圆的路径 
    UIBezierPath* path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(20, 20, 160, 160)]; anim.path = path.CGPath; 

    // 设置时间
     anim.duration = 3; 

    // 设置重复次数 
    anim.repeatCount = INT_MAX; 

    // 3.添加动画 
    [self.layer addAnimation:anim forKey:nil];
}

转场动画（CATransition）

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

#import "ViewController.h"

@interface ViewController()<UIGestureRecognizerDelegate>

@property (nonatomic, strong) UIImageView* imageView;

@property (nonatomic, assign) int index;

@end

@implementation ViewController

//懒加载创建并添加imageView到view上

-(UIImageView *)imageView{

   if (_imageView == nil) { 

      // 获取图片 
      NSString* imageName = [NSString stringWithFormat:@"%d", self.index]; 

      UIImage* image = [UIImage imageNamed:imageName]; 

      //创建视图控制器 
      _imageView = [[UIImageView alloc] initWithFrame:CGRectMake(40, 40, 300, 400)]; 

      _imageView.image = image; //打开交互 
  
      _imageView.userInteractionEnabled = YES; 

      [self.view addSubview:_imageView]; 

  } 

 return _imageView;
}

- (void)viewDidLoad { 
   [super viewDidLoad]; 

   self.index = 1;

   [self addSwipe];

}

- (void)addSwipe{ 
   //添加轻扫手势
   UISwipeGestureRecognizer* swipeLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipe:)]; 

   UISwipeGestureRecognizer* swipeRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipe:)]; 

   swipeRight.direction = UISwipeGestureRecognizerDirectionLeft; 
   
   [self.imageView addGestureRecognizer:swipeLeft]; 

   [self.imageView addGestureRecognizer:swipeRight];
}
- (void)swipe:(UISwipeGestureRecognizer*)sender{ 

    // 转场动画 
    // 1.创建动画 
    CATransition* anim = [[CATransition alloc] init]; 

    // 2.操作 
    anim.type = @"cameraIrisHollowOpen"; 

    if (sender.direction == UISwipeGestureRecognizerDirectionLeft) { 
    
        anim.subtype = kCATransitionFromLeft;

        self.index ++; 
     }else { 

        anim.subtype = kCATransitionFromRight; 

        self.index --; 
     } 

    if (self.index == 6) { 
 
       self.index = 1;
     } 

    if (self.index == 0) { 

       self.index = 5; 
     } 
  
   self.imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"%d",self.index]]; 

   [self.imageView.layer addAnimation:anim forKey:nil];
}
@end

组动画(CAAnimationGroup)

CAAnimation的子类，可以保存一组动画对象，将CAAnimationGroup对象加入层后，组中所有动画对象可以同时并发运行
属性解析：
animations：用来保存一组动画对象的NSArray

默认情况下，一组动画对象是同时运行的，也可以通过设置动画对象的beginTime属性来更改动画的开始时间。

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic, weak) CALayer* layer;

@end

@implementation ViewController

- (void)viewDidLoad{ 

   [super viewDidLoad]; 
   // Do any additional setup after loading the view, typically from a nib. 

   UIView* redView = [[UIView alloc] init]; 

   redView.backgroundColor = [UIColor redColor]; 

   redView.frame = CGRectMake(100, 100, 20, 20); 

   [self.view addSubview:redView]; 

   self.layer = redView.layer;
}

- (void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event{ 

    // 组动画 
    // 1.创建动画对象
    CAAnimationGroup* group = [[CAAnimationGroup alloc] init]; 

    // 2.操作 
    // *1.关键帧动画 - 绕着圆的路径转 
    // ------ 
    // 1.创建动画对象 
    CAKeyframeAnimation* anim = [[CAKeyframeAnimation alloc] init]; 

    // 2.操作
    anim.keyPath = @"position"; 

    // 创建一个圆的路径 
    UIBezierPath* path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 100) radius:80 startAngle:0 endAngle:2 * M_PI clockwise:1]; 

    anim.path = path.CGPath; 
    // ------ 
    // *2.基本动画 - 自转 
    // ------ 
    // 1.创建动画 
    CABasicAnimation* anim1 = [[CABasicAnimation alloc] init]; 

    // 2.操作 
    anim1.keyPath = @"transform.rotation"; anim1.byValue = @(M_PI * 2 * 3); 

    // ------ 
    group.animations = @[ anim, anim1 ];

    // 设置事件 
    group.duration = 3; 

    // 设置次数 
    group.repeatCount = INT_MAX; 

    // 3.添加动画 
    [self.layer addAnimation:group forKey:nil];
}
@end

最后编辑于：2017.12.03 03:14:55

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 217,185评论 6赞 503
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 92,652评论 3赞 393
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 163,524评论 0赞 353
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 58,339评论 1赞 293
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 67,387评论 6赞 391
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 51,287评论 1赞 301
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 40,130评论 3赞 418
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 38,985评论 0赞 275
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 45,420评论 1赞 313
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 37,617评论 3赞 334
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 39,779评论 1赞 348
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 35,477评论 5赞 345
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 41,088评论 3赞 328
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 31,716评论 0赞 22
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 32,857评论 1赞 269
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 47,876评论 2赞 370
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 44,700评论 2赞 354

核心动画

CALayer

什么是隐式动画？

UIView和CALayer的选择

既然CALayer和UIView都能实现相同的显示效果，那究竟该选择谁好呢？

核心动画

基础动画（CABasicAnimation）

关键帧动画（CAKeyframeAnimation）

转场动画（CATransition）

组动画(CAAnimationGroup)

推荐阅读更多精彩内容