iOS 图层树 二
1.3使用图层
首先我们来创建一个简单的项目,来操纵一些layer
的属性。打开Xcode,使用Single View Application模板创建一个工程。
在屏幕中央创建一个小视图(大约200 X 200的尺寸),当然你可以手工编码,或者使用Interface Builder(随你方便)。确保你的视图控制器要添加一个视图的属性以便可以直接访问它。我们把它称作layerView
。
运行项目,应该能在浅灰色屏幕背景中看见一个白色方块(图1.3),如果没看见,可能需要调整一下背景window或者view的颜色
图1.3 灰色背景上的一个白色UIView
这并没有什么令人激动的地方,我们来添加一个色块,在白色方块中间添加一个小的蓝色块。
我们当然可以简单地在已经存在的UIView
上添加一个子视图(随意用代码或者IB),但这不能真正学到任何关于图层的东西。
于是我们来创建一个CALayer
,并且把它作为我们视图相关图层的子图层。尽管UIView
类的接口中暴露了图层属性,但是标准的Xcode项目模板并没有包含Core Animation相关头文件。所以如果我们不给项目添加合适的库,是不能够使用任何图层相关的方法或者访问它的属性。所以首先需要添加QuartzCore框架到Build Phases标签(图1.4),然后在vc的.m文件中引入库。
图1.4 把QuartzCore库添加到项目
之后就可以在代码中直接引用CALayer
的属性和方法。在清单1.1中,我们用创建了一个CALayer
,设置了它的backgroundColor
属性,然后添加到layerView
背后相关图层的子图层(这段代码的前提是通过IB创建了layerView
并做好了连接),图1.5显示了结果。
清单1.1 给视图添加一个蓝色子图层
#import "ViewController.h"
#import
@interface ViewController ()
@property (nonatomic, weak) IBOutlet UIView *layerView;

@end
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
//create sublayer
CALayer *blueLayer = [CALayer layer];
blueLayer.frame = CGRectMake(50.0f, 50.0f, 100.0f, 100.0f);
blueLayer.backgroundColor = [UIColor blueColor].CGColor;
//add it to our view
[self.layerView.layer addSublayer:blueLayer];
}
@end
图1.5 白色UIView
内部嵌套的蓝色CALayer
一个视图只有一个相关联的图层(自动创建),同时它也可以支持添加无数多个子图层,从清单1.1可以看出,你可以显示创建一个单独的图层,并且把它直接添加到视图关联图层的子图层。尽管可以这样添加图层,但往往我们只是见简单地处理视图,他们关联的图层并不需要额外地手动添加子图层。
在Mac OS平台,10.8版本之前,一个显著的性能缺陷就是由于用了视图层级而不是单独在一个视图内使用CALayer
树状层级。但是在iOS平台,使用轻量级的UIView
类并没有显著的性能影响(当然在Mac OS 10.8之后,NSView
的性能同样也得到很大程度的提高)。
使用图层关联的视图而不是CALayer
的好处在于,你能在使用所有CALayer
底层特性的同时,也可以使用UIView
的高级API(比如自动排版,布局和事件处理)。
然而,当满足以下条件的时候,你可能更需要使用CALayer
而不是UIView
:
- 开发同时可以在Mac OS上运行的跨平台应用
- 使用多种
CALayer
的子类(见第六章,“特殊的图层“),并且不想创建额外的UIView
去包封装它们所有 - 做一些对性能特别挑剔的工作,比如对
UIView
一些可忽略不计的操作都会引起显著的不同(尽管如此,你可能会直接想使用OpenGL绘图)
但是这些例子都很少见,总的来说,处理视图会比单独处理图层更加方便。
总结
这一章阐述了图层的树状结构,说明了如何在iOS中由UIView
的层级关系形成的一种平行的CALayer
层级关系,在后面的实验中,我们创建了自己的CALayer
,并把它添加到图层树中。
在第二章,“图层关联的图片”,我们将要研究一下CALayer
关联的图片,以及Core Animation提供的操作显示的一些特性。