1，关于CoreAnimation

CoreAnimation是苹果提供的一套基于绘图的动画框架

2，CALayer

CoreAnimation属于QuartzCore框架，Quartz原本是macOS的Darwin核心之上的绘图技术。在iOS中，我们所看到的视图UIView是通过QuartzCore中的CALayer显示出来的，我们讨论的动画效果也是加在这个CALayer上的。

为什么UIView要加一层Layer来负责显示呢？

QuartzCore是跨iOS和macOS平台的，而UIView属于UIKit是iOS开发使用的，在macOS中对应AppKit里的NSView。这是因为macOS是基于鼠标指针操作的系统，与iOS的多点触控有本质的区别。虽然iOS在交互上与macOS有所不同，但在显示层面却可以使用同一套技术。

每一个UIView都有个属性layer、默认为CALayer类型，也可以使用自定义的Layer

/* view的leyer，view是layer的代理 */
@property(nonatomic,readonly,strong) CALayer  *layer;

CALayer和UIView的区别

1，UIView是UIKit的(只能iOS使用)，CALayer是QuartzCore的(iOS和mac os通用)。

2，UIView继承UIResponder，CALayer继承NSObject；UIView比CALayer多了一个事件处理的功能，也就是说，CALayer不能处理用户的触摸事件，而UIView可以。

3，UIView来自CALayer，是CALayer的高层实现和封装，UIView的所有特性来源于CALayer支持。

4，CABasicAnimation，CAAnimation，CAKeyframeAnimation等动画类都需要加到CALayer上。

CALayer的属性

• CALayer通过四个属性来确定大小和位置, 分别为: frame、bounds、position、anchorPoint。

• CALayer的frame属性，实际上是从bounds和position属性中的值派生的，并且使用频率较低。

属性介绍：

frame

@property CGRect frame;

此属性和view中的frame属性相同.

• 当前layer相对于 superLayer的坐标系

• frame.origin是当前layer左上角相对于superLayer左上角的位置（与layer的锚点没有关系,始终是左上角的位置关系）

• frame.size就是当前layer的大小

bound

@property CGRect bounds;

• 当前layer相对于自身的坐标系。

• bounds.origin是相对于自身的左上角的位置。因此bounds.origin = (0,0)。

• bounds.size 和 frame.size是一样的。

position

@property CGPoint position;

• 在layer体系结构中, layer需要添加在superLayer中,才可以显示出来(和view体系结构相似). 因此,每一个显示出来的layer都有一个superLayer.

• position是layer中的anchorPoint点在superLayer中的位置坐标.

anchorPoint

@property CGPoint anchorPoint;

• anchorPoint点(锚点)的值是用相对bounds的比例值来确定的. 例如(0,0), (1,1)分别表示左上角、右下角,依此类推.

• 锚点都是对于自身来讲的. 确定自身的锚点,通常用于做相对的tranform变换.当然也可以用来确定位置.

不同锚点下做旋转变化的例子：

anchorPoint.jpg

anchorPoint、position、frame之间的相对关系

首先总结一下上面讲的知识点：

• frame中的X,Y表示sublayer左上角相对于superLayer的左上角的距离

• position中的X,Y表示sublay锚点相对于superLayer的左上角的距离

• anchorPoint中的X,Y表示锚点的X,Y的相对距离比例值

当确定锚点,改变frame时, position的值为:

position.x = frame.origin.x + anchorPoint.x * bounds.size.width；
position.y = frame.origin.y + anchorPoint.y * bounds.size.height；

确定锚点, 改变position时, frame的值为:

frame.origin.x = position.x - anchorPoint.x * bounds.size.width；
frame.origin.y = position.y - anchorPoint.y * bounds.size.height；

改变锚点, frame的值变化为:

frame.origin.x = position.x - anchorPoint.x * bounds.size.width；
frame.origin.y = position.y - anchorPoint.y * bounds.size.height；

影响关系：

• 锚点改变, position不影响, frame变化

• frame变化, 锚点不影响, position变化

• position变化, 锚点不影响, frame变化

总结：

1、position是layer中的anchorPoint在superLayer中的位置坐标。

2、互不影响原则：单独修改position与anchorPoint中任何一个属性都不影响另一个属性。

3、frame、position与anchorPoint有以下关系：

frame.origin.x = position.x - anchorPoint.x * bounds.size.width；
frame.origin.y = position.y - anchorPoint.y * bounds.size.height；

第2条的互不影响原则还可以这样理解：position与anchorPoint是处于不同坐标空间中的重合点，修改重合点在一个坐标空间的位置不影响该重合点在另一个坐标空间中的位置。

参考链接：

http://wonderffee.github.io/blog/2013/10/13/understand-anchorpoint-and-position/
https://www.jianshu.com/p/7cc9b8e2889d
https://www.shuzhiduo.com/A/B0zq61GNJv/
https://www.jianshu.com/p/94deaddc78dc