资讯专栏INFORMATION COLUMN

CALayer的基本使用

Shihira / 1626人阅读

摘要:设置边框在中必须导入框架才能设置颜色粗细设置圆角设置阴影设置阴影偏差向左向右偏移设置阴影透明度相当于会将超出边框的剪切掉主层与子层控件的不一定只有一个位于根节点的层称为主层。

图层

UIView之所以能显示到界面上是因为有一个图层。(CALayer)

一、CALayer的基本使用 通过CALayer对象, 可以很方便的调整UIView的一些外观属性。


设置边框(在IOS6中必须导入Quarz框架, 才能设置颜色、粗细):borderWithorderColor
设置圆角:cornerRadius = 10;
设置阴影: shadowColor = [UIColor blackColor].CGColor;
设置阴影偏差: shadowOffSet = CGSizeMake(10, 10); // 向左向右偏移10
设置阴影透明度: shadowOpacity = 0.5; (masksToBounds相当于clipToBounds, 会将超出边框的剪切掉)

主层与子层


控件的Layer不一定只有一个, 位于根节点的层称为主层。其它称为子层。当你设置ImageView的layer的圆角属性缺看不到, 那是因为子层盖住了主层,所以我们看不到已经变为圆角的主层。这时可以设置masksToBounds来将超出主层的部分裁剪掉。

二、图层的transform(图层的transform是3D的, CA ==》 CoreAnimation)


1.结构体方式:
绕着xy平面的对角线选择。
self.iconView.layer.transform = CATransform3DMakeRotaion(M_PI_4, 1, 1, 0);

2.KVC方式

objc// CATransformXX创建出来的是结构体
NSValue * value = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_4, 0, 0, 1)];
[self.iconView.layer setValue:value forKeyPath: @"transform"];


如果仅仅只是想做二维平面的旋转

objc[self.iconView.layer setValue:@(M_PI_2) forKeyPath: @"transform.rotation"]

如果仅仅是y方向的缩放

objc[self.iconView.layer setValue:@(M_PI_2) forKeyPath: @"transform.scale.y"]

查阅官方文档: CATransform3D key path(translation、scale、rotation)

三、新建图层(两种方式)
objc// alloc方式、layer方式
CALayer * layer = [CALayer layer];
layer.backgroundColor = [UIColor redColor].CGColor;
layer.bounds = CGRectMake(0, 0 , 100, 100);
layer.position = CGPointMake(200, 100);
// 设置图层的内容
// 设置layer的属性, 右边一定是结构体类型。所以要CG
// 之所以强制是因为contents id类型
layer.maskToBounds = YES;
layer.contents = (id)[UIImage imageNamed: @"lufy"].CGImage;
// 添加为layer的子图层
[self.view.layer addSublayer: layer];

UIView和CALayer的选择

UIView比CALayer多的是处理事件的功能。UIView之所以能显示出东西, 是因为其里面有一个CALayer图层。
所以如果要根用户交互用UIView.如果不需要交互,CALayer性能会更高。

CALayer的疑惑

1.首先
CALayer是定义在QuartzCore
CGImageRef CGColorRef两种数据类型定义在CoreGraphics框架中
UIColor、UIImage定义在UIKit框架

2.其次
QuartzCore框架和CoreGraphics框架是一个瓜平台。在IOS和OSX上都能用
但UIKit只能在IOS中使用(类都以UI开头.)
为了保证可一直性, QuarzCoreb不能使用UIImage、UIColor只能使用CGImageRef、CGColorRef。
这样就能保持根UIKit没有任何关系。

四、position和anchorPoint

position:
用来设置CALayer在父层中的位置
以父层的左上角为原点(0, 0)

anchorPoint(锚点)
决定着CALayer上哪个点会在position属性所指的位置。
以自己的左上角为左边原点。
一般常用的5个锚点, 左上角(0, 0)、左下角(0, 1)、右上角(1, 0)、右下角(1, 1)、中心点(0.5, 0.5)。

五、隐式动画(练习)

当对非Root-Layer部分属性进行修改。就会产生一些动画效果。(一该属性就会动画)
这些属性称为Animatable Properties(可动画属性)

几个常见的Animatable Properties:
bounds: 用于设置CALayer的宽高。修改这个属性会产生缩放动画
backgroundColor: 设置CALayer的背景色。修改这个属性会产生背景色渐变的动画
position: 产生平移动画。
头文件中有Animtable都是可以做隐式动画的属性。或者在Dash中输入CALayer查看文档。

六、自定义图层(本质就是在图层上绘图)

方式一
继承自CALayer
重写drawInContext:(CGContextRef)ctx; // ctx是图层上下文
调用setNeedsDisplay, 图层才会调用drawInContext进行绘制。

方式二:(交给代理做)
为什layer的代理没有协议。因为这个方法是NSObject方法, 所以就不用说明协议。
设置layer的代理对象
实现drawLayer:inContext:方法

总结:

本节需要掌握

CALayer的基本属性

CALayer与View的关系(简单关系, View能显示的原因)

position和anchorPoint的作用(anchorPoint)

UIView与CALayer的关系深入理解

控件的图层的代理其实就是控件本身。所以我们实现drawRect才能实现绘制UIView。需要注意的是不能更改View内部的代理。

UIView详细的显示过程(面试)

view.layer会准备一个Layer Graphics Context(图形上下文)并传给view.layer.delegate的drawLayer:inContext.

所以View其实只是图层的代理, 当图层需要显示的时候。会调用drawLayer:inContext:方法。

而这个方法中, 如果代理存在, 又会调用delegate的drawRect:(CGRect)rect方法来绘制到图层上。

所以View上的drawRect所画的东西都会绘制到view.layer上面

系统再将view.layer内容拷贝到屏幕, 完成view的显示。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/15732.html

相关文章

  • 图层树和寄宿图 -- iOS Core Animation 系列一

    摘要:提供和两个平行的层级关系,应该也是为了解耦,做职责分离。以便能适应和的系统。因为默认情况下,仍会绘制超过边界的内容,在也不例外。的属性允许我们在图层边框里显示寄宿图的一个子域。因为当图层显示在屏幕上时,不会自动重绘,这和不同。 本系列文章算是一系列读书笔记,想了解更多,请看原文 1.图层树 1.1 视图 一个视图就是在屏幕上显示的一个矩形块(比如图片,文字或者视频),它能够拦截类似于鼠...

    My_Oh_My 评论0 收藏0
  • CALayer 新手指南

    摘要:为了能够缓解这个问题,苹果创建了,它提供了更高级一些的方法,代码量也随之更少。为了使的使用更简单,苹果创建了。当苹果认为中的很多高级高级功能在常规应用中并不总是需要的时候,就诞生了,它提供了中最顶层的图像访问权限。希望你喜欢这个新手指南。 作者:Pranjal Satija,原文链接,原文日期:2016-08-16译者:Cwift;校对:Cee;定稿:CMB 欢迎!这篇文章将教你一项 ...

    Crazy_Coder 评论0 收藏0
  • 图层几何学 -- iOS Core Animation 系列二

    摘要:图层树和寄宿图系列一介绍了图层的基础知识和一些属性方法。的值实际指的是图层旋转之后整个轴对齐的矩形区域。和系列一中提到的类似,用单位坐标来表示默认情况是。可以通过指定和值小于或者大于,使它放置在图层范围之外。 《图层树和寄宿图 -- iOS Core Animation 系列一》介绍了图层的基础知识和一些属性方法。这篇主要内容是学习下图层在父图层上怎么控制位置和尺寸的。 1.布局 首先...

    Doyle 评论0 收藏0
  • 关于Core Animation动画(上)

    摘要:关于动画上与对于和,大家应该都很熟悉。需要注意的是,所关联的,是禁用了隐式动画的。而称为展现图层,它实际上是的一份拷贝,表示了任意时刻屏幕显示的的真实值。 关于Core Animation动画(上) 1. UIView与CALayer 对于UIView和CALayer,大家应该都很熟悉。通常我们了解到UIView是通过视图树的结构来组织起来的,实际上,UIView管理并维护了另一个图层...

    cjie 评论0 收藏0
  • [分享]iOS开发-UI篇:CAlayer属性

    摘要:红色图层的锚点是,红色图层的锚点是,红色图层的锚点是,红色图层的锚点是,代码示例没有设置锚点。修改这个属性会产生缩放动画用于设置的背景色。也可以查看官方文档文档中标明的这些属性都是支持隐式动画的分享来源 iOS开发UI篇—CAlayer层的属性 一、position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @p...

    xzavier 评论0 收藏0

发表评论

0条评论

Shihira

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<