一个重要的类CALayer ——主要属性及其在显示图片中的简单应用（三）

版本记录

版本号	时间
V1.0	2017.11.21

前言

大家都知道UIView之所以可以显示内容，主要是靠其底层的CALayer。CALayer包含在QuartzCore框架中，这是一个跨平台的框架，既可以用在iOS中又可以用在Mac OS X中。在使用Core Animation开发动画的本质就是将CALayer中的内容转化为位图从而供硬件操作，所以要熟练掌握动画操作必须先来熟悉CALayer。感兴趣的可以看我写的上面几篇。
1. 一个重要的类CALayer —— 基本概览（一）
2. 一个重要的类CALayer —— 其与UIView的区别（二）

CALayer的重要属性

CALayer有很多重要属性，它们其中的很多在修改时都会形成动画效果，这时候这种属性也可以称为隐式动画属性。

下面我们就看一下CALayer的相关属性，以及支持隐式动画的情况。

属性	说明	是否支持隐式动画
anchorPoint	锚点，和position重合的点，默认在中心（0.5, 0.5）的位置。	是
backgroundColor	背景色	是
borderColor	边框颜色	是
borderWidth	边框宽度	是
bounds	图层大小	是
contents	图层显示内容	是
contentsRect	图层显示内容的大小和位置	是
cornerRadius	圆角半径	是
doubleSided	图层背面是否显示，默认是YES	否
frame	图层大小和位置，不支持隐式动画，CALayer中很少使用frame，一般用bounds和position代替。	否
hidden	是否隐藏	是
mask	图层蒙版	是
maskToBounds	子图层是否剪切图层边界，默认为NO	是
opacity	透明度	是
position	图层中心点位置，类似于Center	是
shadowColor	阴影颜色	是
shadowOffset	阴影偏移量	是
shadowOpacity	阴影透明度，默认为0，如果设置阴影就要设置该属性	是
shadowPath	阴影的形状	是
shadowRadius	阴影模糊半径	是
sublayers	子图层	是
sublayerTransform	子图层形变	是
transform	图层形变	是

下面我们重点说一下AnchorPoint和Position这两个属性。

1. anchorPoint和position属性

anchorPoint属性是图层的锚点，范围在（0~1, 0~1）表示在x、y轴的比例，这个点永远可以同position（中心点）重合，当图层中心点固定后，调整anchorPoint即可达到调整图层显示位置的作用（因为它永远和position重合）。

下面看一个例子。

假设有一个层大小100*100，现在中心点位置（50,50），由此可以得出frame（0,0,100,100）。上面说过anchorPoint默认为（0.5,0.5），同中心点position重合，此时使用图形描述如图1；当修改anchorPoint为（0,0），此时锚点处于图层左上角，但是中心点poition并不会改变，因此图层会向右下角移动，如图2；然后修改anchorPoint为（1,1,），position还是保持位置不变，锚点处于图层右下角，此时图层如图3。

相信看完这个例子，我们就能很明白anchorPoint和position的作用了。

---

CALayer与UIImageView

大家可能好奇，为什么把他们拿出来作比较，其实在显示图片的时候，我们一般用UIImageView，但是其实CALayer也是可以的，因为他有一个contents属性，此外，CALayer还有一个优点就是比UIImageView节省内容。

下面看一下代码。

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

#pragma mark - Override Base Function

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor lightGrayColor];
    
    CALayer *layer = [CALayer layer];
    layer.frame = CGRectMake(100.0, 250.0, 250.0, 150.0);
    layer.backgroundColor = [UIColor redColor].CGColor;
    NSString *imagePathStr = [[NSBundle mainBundle] pathForResource:@"sea.jpg" ofType:nil];
    layer.contents = (id)[UIImage imageWithContentsOfFile:imagePathStr].CGImage;
    [self.view.layer addSublayer:layer];
}

@end

下面看一下效果。

这里在加载图片的时候遇到个小插曲，就是[[NSBundle mainBundle] pathForResource:@"sea.jpg" ofType:nil]从路径加载图片一直是nil，后来一查才发现是主包没把图片加入的原因，像下图那样设置就好了。

还有就是layer.contents = (id)[UIImage imageWithContentsOfFile:imagePathStr].CGImage类型必须是CGImage。这个用layer显示图片要比UIImageView省内存，缺点就是它不能传递和响应事件。代码已经上传至Github - 刀客传奇。

参考文章

1. iOS开发系列:让你的应用“动”起来--CALayer

后记

未完，待续~~~