浅谈CALayer

1.UIview和CALayer的区别和联系
2.通过layer 设置UIView的阴影
3.直接进行layer操作
4.隐式动画
5.通过layer进行简单的动画效果

1.UIview和CALayer的区别和联系

UIview 是所有视图的基类
CALayer是图层类

但是他俩是平行的层级关系,每个UIview都有一个CALayer的实例图层属性,他们的出现是为了视图绘制,显示和布局解耦,其中UIwindow是继承自uiview的

联系:

CALayer在UIview背后提供更加丰富灵活的图形操作
UIview作为CALayer的代理更加快速的帮CALayer显示一些常用的ui元素并提供交互

区别:

响应:UIview 继承自uiresponder,可以响应用户事件,CALayer 继承自nsobject,无法响应用户事件
分工:UIview侧重于队显示内容的管理和整体布局,CALayer侧重显示内容的绘制.显示和动画
框架:UIview属于uikit框架(主要构件用户界面),CALayer属于quartzcore框架，CGColor属于coreGraphics

综上：CAlayer更加轻量级，性能更高，但是扩展性差，假设突然一天需要交互了，就要emmm了

2.通过layer 设置UIView的阴影

self.aView = [[UIView alloc]initWithFrame:CGRectMake(50, 50, 100, 100)];
self.aView.backgroundColor = [UIColor redColor];
[self.view addSubview:self.aView];
[self layerforView];

- (void)layerforView
{
    //先设置透明度，不然也看不到
    self.aView.layer.shadowOpacity = 1;//透明度，Defaults to 0,取值[0 1]
    self.aView.layer.shadowColor = [UIColor blueColor].CGColor;
    self.aView.layer.shadowRadius = 5;//阴影模糊半径，Defaults to 3.
    self.aView.layer.shadowOffset = CGSizeMake(-15, -15);//偏移量，Defaults to (0, -3)

    //众所周知，通常圆角，遮罩，不透明度，阴影，渐变，光栅化和抗锯齿等这些都会触发离屏渲染，
    //我有一篇文章也讲述到了离屏渲染 https://www.jianshu.com/p/6225529f4015
    //使用shadowPath据说可以减少渲染时损耗的性能
    self.aView.layer.shadowPath = [[UIBezierPath bezierPathWithRect:self.aView.bounds] CGPath];
    
    //边框
    self.aView.layer.borderWidth = 2;//边框向内缩进
    self.aView.layer.borderColor = [UIColor blackColor].CGColor;

    //还是那个圆角
    self.aView.layer.cornerRadius = 50;
    //多图层时才需要设置下面这个属性，具体还阔以看上面的离屏渲染
    //masksToBounds将底层的图层设置成圆角，并进行裁剪掉以外的
    self.aView.layer.masksToBounds = YES;//通常使用在imageView和Btn上，image是设置在layer.contents中
}

效果图：过于基础，略

3.直接进行layer操作

- (void)layerTest
{
    self.la = [CALayer layer];
    self.la.backgroundColor = [UIColor redColor].CGColor;
    //此处设置bounds 而不是frame， 为了了解position 和 anchorPoint
//    self.la.bounds = CGRectMake(0, 0, 100, 100);
    self.la.frame = CGRectMake(0, 0, 100, 100);
    [self.view.layer addSublayer:self.la];
    self.la.contents = (__bridge id _Nullable)([UIImage imageNamed:@"0"].CGImage);
    //以上设置的为bounds，会显示layer的四分之一，因为锚点默认值的问题

    //position设置layer在父层中的位置，以父层的左上角为原点
    //anchorPoint 锚点，以自身的左上角为原点，Defaults to'(0.5, 0.5)'，取值(0, 1)，所以上图只显示右下角的四分之一
    self.la.position = self.view.center;
    self.la.anchorPoint = CGPointMake(0, 0);
      
}

4.隐式动画

细心的人会发现，touchesBegan的时候，设置修改self.la.position，会有动画效果，如果你不想要

    //只有自己创建的图层才有隐式动画
    //上面点击屏幕设置self.la.position = CGPointMake(0, 0); 是有动画效果的
    //取消隐式动画（通过事务）
    [CATransaction begin];
    //内部设置
    [CATransaction setDisableActions:YES]; //取消隐式动画
    //[CATransaction setAnimationDuration:2];
    self.la.position = CGPointMake(0, 0);   
    [CATransaction commit];

5.通过layer进行简单的动画效果

 //旋转为例 ，参数是 旋转角度，旋转轴 ： x y z
self.aView.layer.transform = CATransform3DMakeRotation(M_PI, 1, 1, 1);

    //使用kvc一样可以，不过要先把结构体CATransform3DMakeRotation转化成NSvalue，因为kvc的value为id类型
    //那么使用kvc做简单的transform操作（平移，缩放，旋转）肯定更不在话下了，直接设置就可以

最后编辑于：2020.07.21 12:10:08