新浪微博 有道云笔记 麦库 EverNote Pocket Instapaper 更多

CALayer---iOS-Apple苹果官方文档翻译之CALayer

 

 


CALayer

page1image3224 page1image3384

CALayer简介

  • Core Animation是跨平台的,支持iOS环境和Mac OS X环境 

  • 注意:凡是支持跨平台的框架,都不能直接使用UIKit框架,因为UIKit 框架只能应用在iOS而不能用于Mac 

     

  • 学习核心动画之前,需要先理解CALayer,因为核心动画操作的对象 是CALayer,而不是UIView 

     

  • CALayer是核心动画的基础,可以做圆角、阴影、边框等效果   

  • 每个UIView内部都有一个Layer的属性   

  • 在实现核心动画时,本质上是将CALayer中的内容转换成位图(一种 图像格式),从而便于图形硬件的操纵

page2image4288 

UIViewCALayer基本演练
 演练设置UIView中的CALayer属性 

 圆角、边框、阴影及3D形变属性   

 注意: 
1. UIViewCALayer只是一个类声明,需要添加QuartzCore框架  2. 在使用颜色时,不能直接使用UIColor而需要将颜色转成CGColor 

3. 修改图层相当于修改UIView属性,即修改了界面属性 
4. 要设置阴影,需要同时指定阴影的偏移尺寸、颜色和透明度  5. 形变属性既可以用形变函数指定,也可以用keyPath指定

page4image3112

UIImageViewCALayer基本演练

 演练1.设置UIImageView中的CALayer属性  圆角、边框、阴影 
 注意: 

 UIImageView中不仅一个子图层,因此设置圆角时需要使用 setMasksToBounds:YES,让所有子图层跟随边框,不过设置

该属性后,无法使用阴影效果 
 解决办法:可以在底层附加一个UIView实现阴影效果 

 演练2.设置UIImageView中的CALayer属性 

  • –   transform 

  • –   说明:transform属性可以调整CALayer的形变,其中包括:旋转、 缩放、平移 

  • –   transform属性的参数查询:CATransform

page5image4032 
//转载请注明出处--本文永久链接:http://www.cnblogs.com/ChenYilong/p/3493222.html
 
 

CALayer中的圆角半径的示意图

page7image1168
page7image1328

transform属性表


keyPath

说明

rotation.x

X轴旋转角度NSNumber 

rotation.y

Y轴旋转角度NSNumber 

rotation.z

Z轴旋转角度NSNumber 

rotation

Z轴旋转角度NSNumber 

scale.x

X轴缩放比例NSNumber 

scale.y

Y轴缩放比例NSNumber 

scale.z

Z轴缩放比例NSNumber 

scale

三个轴缩放比例NSNumber 

translation.x

X轴平移量NSNumber 

translation.y

Y轴平移量NSNumber 

translation.z

Z轴平移量NSNumber 

translation

X,Y轴平移量的NSValue CGPoint的包装 

图层和视图之间的关系

 创建视图对象时,视图会自己创建一个层,视图在绘图(如

drawRect:)时,会将内容画在自己的层上。当视图在层上完成绘图

后,系统会将图层拷贝至屏幕(CALayer绘图的上下文是图像,整个 画完后,才显示,提前绘制提高性能以及用户体验)。每个视图都有 一个层,每个图层又可以有多个子层 

 

 提示: 
1. Layer的设计目的不是为了取代视图,不能基于CALayer创建一个

独立的可视化组件 
2. Layer的设计目的是提供视图的基本可视内容,以便提高动画的

执行效率 

3. 除提供可视内容外,Layer不负责视图的事件响应等工作,同时 Layer不能参与到响应者链条中

page9image4128

CALayer层次结构图

page10image1168
page10image1328

CALayer的使用说明

  • 通过UIViewlayer属性可以拿到对应的根层,这个层不允许重新创建,但可以

    往层里面添加子层(调用CALayeraddSublayer) 

  • 要具体使用CALayer,需要引入<QuartzCore/QuartzCore.h> 

  • 获取当前图层或使用静态方法layer初始化CALayer后,可以设置以下属性:

    1. bounds:宽度和高度 

    2. position:位置(默认指中心点,具体由anchorPoint决定) 

    3. anchorPoint:锚点(x,y的范围都是0-1),决定了position的含义 

    4. backgroundColor: 背景颜色(CGColorRef类型) 

    5. borderColor:边框颜色(CGColorRef类型) 

    6. borderWidth:边框宽度 

    7. cornerRadius:圆角半径 

    8. contents: 内容(比如设置为图片CGImageRef

  • 注意:虽然CALayer可以使用frame,但最好还是使用boundsposition。为层设 置动画时,用boundsposition会方便一点

page11image5192

演练2——创建自定义图层

 演练: 创建自定义图层,并设置以下属性: 
 bounds:宽度和高度 
 backgroundColor: 背景颜色(CGColorRef类型
 position:位置(默认指中点,具体由anchorPoint决定) 
 anchorPoint:锚点(x,y的范围都是0-1),决定了position的含义   contents:内容CGImageRef 

 

 注意: 
1. 注意锚点和位置的关系,以及在旋转转换时对图层的影响 

2. UIView有一个addSubview方法,而layer有一个addSubLayer方法 

 

 提示: 
 锚点在游戏开发中使用比较频繁,而在应用开发中极少使用

page12image4224

 //转载请注明出处--本文永久链接:http://www.cnblogs.com/ChenYilong/p/3493222.html

CALayer图像及颜色的注意事项  注意: 

 CALayer中使用CGColorRefCGImageRef的数据类型,而不用 UIColorUIImage 

 原因: 

 QuartzCore(包含CALayer类)和Core Graphics(包含 CGImageRefCGColorRef)框架都能在iOSMac OS X上使

用,但是UIKit(包含UIImage和其他UI开头的类)只能在iOS中使 用 

 为了保证可移植性,QuartzCore不能使用UIImage,只能使用 CGImageRef 

 不过很多情况下,可以通过UIKit对象的特定方法,可以得到Core Graphics对象,如UIImageCGImage方法和UIColorCGColor

方法

page14image4176

CALayer的隐式动画属性

  • 每一个UIView内部都默认关联着一个CALayer,称这个LayerRoot Layer所有

    的非Root Layer都存在着隐式动画,隐式动画的默认时长为1/4秒。 

     

  • 修改非Root Layer的部分属性时,相应的修改会自动产生动画效果,能执行隐式 动画的属性被称为可动画属性,诸如

    1. bounds: 缩放动画 

    2. position: 平移动画 

 3. opacity: 淡入淡出动画(改变透明度) 

 在文档中搜素animatable可以找到所有可动画属性   

 如果要关闭默认的动画效果,可以通过动画事务方法实现:  [CATransaction begin]; 
[CATransaction setDisableActions:YES]; 
// ...

 [CATransaction commit]; 
page15image5120

演练3——CALayer的隐式动画  创建自定义图层 

 在触摸事件中,设置图层的可动画属性:   位置 

 颜色 
 透明度 
 边框 
 圆角 
 旋转角度   内容 

 ......

//转载请注明出处--本文永久链接:http://www.cnblogs.com/ChenYilong/p/3493222.html

page16image3336

CALayer上绘图
 要在CALayer上绘图,有两种方法:

1. 创建一个CALayer的子类,然后覆盖drawInContext:方法,可以 使用Quartz2D API在其中进行绘图 

2. 设置CALayerdelegate,然后让delegate实现 drawLayer:inContext:方法进行绘图 

 注意: 
 不能再将UIView设置为这个CALayerdelegate,因为UIView对象

已经是内部层的delegate,再次设置会出问题 

 无论使用哪种方法,都必须向层发送setNeedsDisplay消息,以触 发相应绘图方法的调用

page17image3440

CALayerUIView以及上下文之间的关系

 UIView收到setNeedsDisplay消息时,CALayer会准备好一个 CGContextRef,然后向它的delegateUIView,发送消息,并且传入 已经准备好的CGContextRef对象。UIViewdrawLayer:inContext:方 法中会调用自己的drawRect:方法 

 

 平时在drawRect:中通过UIGraphicsGetCurrentContext()获取的就是由 CALayer传入的CGContextRef对象,在drawRect:中完成的所有绘图 都会填入CALayerCGContextRef中,然后被拷贝至屏幕 

 

 CALayerCGContextRef用的是位图上下文(Bitmap Graphics Context)

page18image3464

CALayer绘图演练

 演练重点: 
 以自定义Layer的方式实现绘图   利用坐标系缩放比例翻转图像

page19image1832
page19image1992
 
获取CALayer中的内容——截屏 
UIGraphicsBeginImageContext(self.view.bounds.size);

[self.view.layer renderInContext:UIGraphicsGetCurrentContext()];  

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();  

UIGraphicsEndImageContext(); 

 

说明:使用renderInContext方法可以将指定图层及其子图层中的内容渲 染输出到指定的上下文中

page21image3432

本节知识点回顾

  • 每个UIView内部都有一个Layer的属性 

  • 要具体使用CALayer,需要引入<QuartzCore/QuartzCore.h> 

  • CALayer中使用CGColorRefCGImageRef的数据类型,而不用 UIColorUIImage 

  • 所有的非Root Layer都存在着隐式动画 

  • 创建一个CALayer的子类,然后覆盖drawInContext:方法,可以使用

    Quartz2D API在其中进行绘图 

  • 在实现核心动画时,本质上是将CALayer中的内容转换成位图,从而 便于图形硬件的操纵

page22image3560    

 

https://www.evernote.com/shard/s227/sh/b5620719-a63c-4ac0-8c27-2fbc6a38d2c9/a93cf21128078f88e7b811c6a8751319

posted @ 2013-12-26 22:42  iTeaTime(技术清谈)  阅读(841)  评论(0编辑  收藏  举报