《iOS核心动画高级技巧》笔记(一) - 图层／寄宿图

Snip20170526_11.png

Snip20170526_12.png

Snip20170526_13.png

图层的树状结构

• Core Animation是一个复合引擎，它的职责就是尽可能快地组合屏幕上不同的可视内容，这个内容是被分解成独立的图层，存储在一个叫做图层树的体系之中。于是这个树形成了UIKit以及在iOS应用程序当中你所能在屏幕上看见的一切的基础。

• 视图：在iOS当中,视图都从一个叫做UIVIew的基类派生而来，可以处理事件、支持绘图、旋转缩放、做动画等。
• 图层：CALayer类在概念上和UIView类似，和UIView最大的不同是CALayer不处理用户的交互。
• 平行的层级关系：每一个UIview都有一个CALayer实例的图层属性，视图的职责就是创建并管理这个图层，图层才是真正用来在屏幕上显示和做动画,UIView仅仅是对它的一个封装，提供具体功能。

为什么iOS要基于UIView和CALayer提供两个平行的层级关系,不用一个简单的层级来处理所有事情呢？

• 原因在于要做职责分离，这样也能避免很多重复代码。就好比在iOS和Mac OS两个平台上，分别有UIView和NSView。他们功能上很相似，但是在实现上有着显著的区别。

• 实际上，这里并不是两个层级关系，而是四个：视图层级，图层树，呈现树和渲染树。

• 图层的能力：

• 阴影，圆角，带颜色的边框

• 3D变换

• 非矩形范围

• 透明遮罩

• 多级非线性动画

• 使用视图而不是CALayer的好处：你能在使用所有CALayer底层特性的同时，也可以使用UIView的高级API。以下情况除外：

• 开发同时可以在Mac OS上运行的跨平台应用

• 使用多种CALayer的子类，并且不想创建额外的UIView封装它们所有

• 做一些对性能特别挑剔的工作

寄宿图

• 图层中包含的图

contents属性

• CALayer的属性，类型被定义为id，但在实践中，如果你给contents赋的不是CGImage，那么你得到的图层将是空白的。

• 为什么该属性为id类型？
• 因为在Mac OS系统上，这个属性对CGImage和NSImage类型的值都起作用。

• 要赋值的类型是CGImageRef：是一个指向CGImage结构的指针:typedef struct CGImage *CGImageRef，是Core Foundation类型,不是Cocoa类型,需要bridged关键字转换。

• 设置的代码：layer.contents = (__bridge id _Nullable)image.CGImage;

contentGravity

• 图片可能会有点变形。在UIView中，我们可以通过contentMode属性进行调节。
• 对UIView大多数视觉相关的属性操作，其实是对对应图层的操作。
• CALayer与contentMode对应的属性叫做contentsGravity，NSString类型.
• contentGravity可选取值：
• kCAGravityCenter
• kCAGravityTop
• kCAGravityBottom
• kCAGravityLeft
• kCAGravityRight
• kCAGravityTopLeft
• kCAGravityTopRight
• kCAGravityBottomLeft
• kCAGravityBottomRight
• kCAGravityResize(根据视图的比例去拉伸图片内容)
• kCAGravityResizeAspect(保持图片内容的纵横比例，来适应视图的大小)
• kCAGravityResizeAspectFill(用图片内容来填充视图的大小，多余得部分可以被修剪掉来填充整个视图边界。)

contentsScale

• 定义了寄宿图的像素尺寸和视图大小的比例，默认为 1.0 。

• 属于支持高分辨率（又称Hi-DPI或Retina）屏幕机制的一部分。它用来判断在绘制图层的时候应该为寄宿图创建的空间大小，和需要显示的图片的拉伸度.

• 对应UIView的contentScaleFactor属性。

• 如果contentsScale设置为1.0，将会以每个点 1 个像素绘制图片，如果设置为2.0，则会以每个点2个像素绘制图片，这就是我们熟知的Retina屏幕。

• 一定要记住要手动设置图层的该属性:layer.contentsScale = [UIScreen mainScreen].scale;

maskToBounds

• 对应UIView的clipsToBounds属性
• 用来决定是否显示超出边界的内容

contentsRect

• 允许我们在图层边框里显示寄宿图的一个子域，默认取值是{0, 0, 1, 1}(简单讲就是显示图片的一部分，取值都为 0～1 ，相对值)。
• 图片拼合：单张大图包含许多小图片，利用该属性，每个图层显示某一张小图片，有效地提高了载入性能（单张大图比多张小图载入地更快）。

contentsCenter

• CGRect类型，定义了一个固定的边框和一个在图层上可拉伸的区域。
• 默认取值{0, 0, 1, 1},意味着如果大小改变了,图片会均匀地拉伸开
• 效果和UIImage里的resizableImageWithCapInsets:方法效果类似，区别是它可以运用到任何寄宿图，包括在Core Graphics运行时绘制的图形。

Snip20170416_1.png

自定义绘图

• 设置contents不是唯一设置寄宿图的方法。也可以直接用Core Graphics绘制寄宿图。通过继承UIView并实现drawRect:方法来自定义绘制。
• 该方法没有默认的实现，如果UIView检测到实现了该方法，就会为视图分配一个寄宿图，这个寄宿图的像素尺寸等于视图大小乘以 contentsScale的值。如果不需要寄宿图，那就不要创建这个方法，会造成CPU资源和内存的浪费.

• CALayer的delegate属性，实现了CALayerDelegate协议，当CALayer需要一个内容特定的信息时，就会从协议中请求。UIView默认遵守了该协议。
• 当被重绘时，CALayer会请求它的代理给他一个寄宿图来显示。-(void)displayLayer:(CALayer *)layer;,趁着这个机会，如果代理想直接设置contents属性的话，它就可以这么做.
• 如果代理不实现-displayLayer:方法，CALayer才会尝试调用这个方法：- (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx;,在调用这个方法之前，CALayer创建了一个合适尺寸的空寄宿图（尺寸由bounds和contentsScale决定）和一个Core Graphics的绘制上下文环境，为绘制寄宿图做准备，他作为ctx参数传入。

@implementation ViewController

• (void)viewDidLoad
  {
  [super viewDidLoad];
  CALayer *blueLayer = [CALayer layer];
  blueLayer.frame = CGRectMake(50.0f, 50.0f, 100.0f, 100.0f);
  blueLayer.backgroundColor = [UIColor blueColor].CGColor;
  blueLayer.delegate = self;
  blueLayer.contentsScale = [UIScreen mainScreen].scale;
  [self.layerView.layer addSublayer:blueLayer];
  //不同于UIView，当图层显示在屏幕上时，CALayer不会自动重绘它的内容。它把重绘的决定权交给了开发者。
  //文档介绍：重新加载此图层的内容。 调用-drawInContext：方法，然后更新图层的`contents'属性。 通常不直接调用。
  [blueLayer display];
  }
• (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx
  {
  CGContextSetLineWidth(ctx, 10.0f);
  CGContextSetStrokeColorWithColor(ctx, [UIColor redColor].CGColor);
  CGContextStrokeEllipseInRect(ctx, layer.bounds);
  }
  @end

* **注意：**代码中的`display`调用。
* 当`UIView`创建了它的宿主图层时，它就会自动地把图层的`delegate`设置为它自己，并提供了一个`-displayLayer:`的实现。

• 当使用寄宿了视图的图层的时，不必实现-displayLayer:和-drawLayer:inContext:方法来绘制你的寄宿图。通常做法是实现UIView的-drawRect:方法，UIView就会帮你做完剩下的工作，包括在需要重绘的时候调用-display方法。