CALayer(持续更新)-阿里云开发者社区

开发者社区> 游贤明> 正文

CALayer(持续更新)

简介:
+关注继续查看

CALayer

The CALayer class manages image-based content and allows you to perform animations on that content. Layers are often used to provide the backing store for views but can also be used without a view to display content. A layer’s main job is to manage the visual content that you provide but the layer itself has visual attributes that can be set, such as a background color, border, and shadow. In addition to managing visual content, the layer also maintains information about the geometry of its content (such as its position, size, and transform) that is used to present that content onscreen. Modifying the properties of the layer is how you initiate animations on the layer’s content or geometry. A layer object encapsulates the duration and pacing of a layer and its animations by adopting the CAMediaTiming protocol, which defines the layer’s timing information.

CALayer类能管理基于图片的内容,允许你在图片内容上执行动画.Layer经常被用来当做view存储容器,其也能够脱离view独立的显示内容.一个layer的主要工作就是管理你提供的可视化对象,但是layer它自身也有很多可见属性可以设置,诸如背景色,边框以及阴影.它还额外的管理其他可视化的一些内容.layer还包括了相关坐标信息用来在屏幕上显示.修改layer的属性可以在屏幕上产生动画效果.一个layer对象将一个layer动画的时间以及步骤通过继承 CAMediaTimeing 协议封装起来,这个协议决定了 layer 的时间轴信息.

 

1. 测试UIImageView与CALayer之间的关系

以下为打印信息:

2014-04-18 10:21:28.406 StudyCoreAnimation[672:60b] <CGImage 0x16521520>
2014-04-18 10:21:28.409 StudyCoreAnimation[672:60b] {{100, 100}, {100, 100}}

很明显,layer的内容是图片,坐标系也是与View的一致.

 

延时两秒后改变一些值,并重新检测layer值的变化.

2014-04-18 10:27:40.292 StudyCoreAnimation[685:60b] <CGImage 0x17656050>
2014-04-18 10:27:40.295 StudyCoreAnimation[685:60b] {{100, 100}, {100, 100}}
2014-04-18 10:27:40.297 StudyCoreAnimation[685:60b] 0.500000
2014-04-18 10:27:42.489 StudyCoreAnimation[685:60b] {{100, 100}, {200, 200}}
2014-04-18 10:27:42.491 StudyCoreAnimation[685:60b] 0.900000

 

你会发现,layer的值与View中设置的值是一致变化的.是否我们可以理解成layer是View的容器,View中设置的值直接影响layer的行为.那如果我们直接改变layer的值会影响View的相关属性么?

2014-04-18 10:32:28.157 StudyCoreAnimation[699:60b] <CGImage 0x16536770>
2014-04-18 10:32:28.161 StudyCoreAnimation[699:60b] {{100, 100}, {100, 100}}
2014-04-18 10:32:28.164 StudyCoreAnimation[699:60b] 0.500000
2014-04-18 10:32:30.364 StudyCoreAnimation[699:60b] {{100, 100}, {200, 200}}
2014-04-18 10:32:30.366 StudyCoreAnimation[699:60b] 0.900000

 

目前可以看出,设置View上的相关属性实际上是在直接设置layer的属性.一个View与一个layer一一绑定,我们来试试添加一个新的layer到View中看看效果.

2014-04-18 10:41:25.063 StudyCoreAnimation[33874:60b] {{0, 0}, {50, 50}}

至少从打印信息可以看出,新添加的layer设置的frame值是以这个View的bound值为基准的,我们再来看看设置这个View自己的layer时是否会影响新添加的layer.

2014-04-18 10:47:04.927 StudyCoreAnimation[34006:60b] {{0, 0}, {50, 50}}

你会发现,绑定的layer的透明度以及坐标更改了,它影响到了新添加的layer,但是,它自己size的改变却没有影响到新添加的layer的size的改变.

新layer的size并没有随着绑定layer的值的改变而按比例改变.

想按照等比例缩放,需要自己设置等比例的值来缩放.

而且,执行看变化的时候还有动画改变的效果,如果你要关闭动画效果,用下面的方式就行了:

还可以进行layer动画速度的设置:

 

设置mask

这是用来遮罩的图片mask

显示的实际效果:

 

小结:

1. 被View绑定的layer,其参数的改变,如果涉及到size的修改并不会影响新添加layer的size.

2. 绑定的layer参数改变的时候,是没有动画效果的.

3. 新添加进来的layer在修改值时有动画效果,我们可以关闭动画也可以开启动画,并设置动画的速度.

4. 初始化新layer时要记得设置初始frame.

 

 

2. UIView animateWithDuration与layer的关系

2014-04-18 12:56:44.395 StudyCoreAnimation[35617:1303] {{100, 100}, {200, 200}}
2014-04-18 12:56:44.397 StudyCoreAnimation[35617:1303] 0.100000

从打印结果可以看出,UIView中使用的animateWithDuration方法的动画改变了layer的值.

如果对layer进行动画,会有什么效果呢?

2014-04-18 13:06:22.012 StudyCoreAnimation[35799:60b] {{100, 100}, {100, 100}}
2014-04-18 13:06:22.015 StudyCoreAnimation[35799:60b] 1.000000

从打印结果可以看出,对View中layer执行动画后,它的值一直都没有改变.与UIView的动画有着本质的区别.

动画是2s,我在1s的时候打印了opacity的值

2014-04-18 13:10:52.116 StudyCoreAnimation[35847:60b] {{100, 100}, {100, 100}}
2014-04-18 13:10:52.117 StudyCoreAnimation[35847:60b] 0.100000

从结果可以看出,layer一开始的值就是被设置成了0.1,动画的途中其打印值还是为0.1,从这里大概可以了解CABasicAnimation的原理了.它一次只能设定一个值,当给layer提交动画时,我猜测发生了如下现象:

1. 完整的拷贝了被绑定的layer

2. 隐藏被绑定的layer

3. 动画结束时移除拷贝的layer并显示出被绑定的layer

我来验证我的看法,如下图所示,我把View动画设置成3s,然后,在1s的时候打印出该View的layer的值,发现早就已经设置成最终结果了.

再来看看removedOnCompletion参数

从以上可以看出,动画结束了效果没有被移除,效果还在,但是alpha的值还是为1,执行了removeAllAnimations时才还原.

 

小结:

1. View的动画实际上是对layer动画的封装,并在动画刚开始的时候就已经把layer相关值设定好了,动画只是一个过程

2. CABasicAnimation动画结束后是需要设定一个layer相关改变的值的,否则会还原

3. 另外一种解释现象的方法是:动画并没有实时改变layer的值,动画只是一种提交给系统用来在layer上进行绘制的一个渲染过程,并不是实时的改变layer的值,动画效果只关注你提供layer的初始值,layer的结束值,然后渲染出效果,并不关心动画结束后,layer的参数变化,他是脱离于layer的.

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
10074 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,大概有三种登录方式:
2962 0
阿里云服务器ECS远程登录用户名密码查询方法
阿里云服务器ECS远程连接登录输入用户名和密码,阿里云没有默认密码,如果购买时没设置需要先重置实例密码,Windows用户名是administrator,Linux账号是root,阿小云来详细说下阿里云服务器远程登录连接用户名和密码查询方法
11612 0
使用SSH远程登录阿里云ECS服务器
远程连接服务器以及配置环境
2511 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
10882 0
如何设置阿里云服务器安全组?阿里云安全组规则详细解说
阿里云安全组设置详细图文教程(收藏起来) 阿里云服务器安全组设置规则分享,阿里云服务器安全组如何放行端口设置教程。阿里云会要求客户设置安全组,如果不设置,阿里云会指定默认的安全组。那么,这个安全组是什么呢?顾名思义,就是为了服务器安全设置的。安全组其实就是一个虚拟的防火墙,可以让用户从端口、IP的维度来筛选对应服务器的访问者,从而形成一个云上的安全域。
7491 0
阿里云服务器ECS登录用户名是什么?系统不同默认账号也不同
阿里云服务器Windows系统默认用户名administrator,Linux镜像服务器用户名root
4502 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
7365 0
+关注
711
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载