关于CALayer
- 在iOS中,UIView之所以能显示在屏幕上,完全是因为它内部的一个图层
- 在创建UIView对象时,UIView内部会自动创建一个图层(即CALayer对象),通过UIView的layer属性可以访问到这个层
- 当UIView需要显示到屏幕上时,会调用drawRect:方法进行绘图,并且会将所有内容绘制在自己的图层上,绘图完毕后,系统会将图层拷贝到屏幕上,于是就完成了UIView的显示
- UIView本事是不具有显示功能的,是因为内部的层才有了显示功能
关于CALayer的疑惑
- CALayer是定义在QuartzCore框架中
- CGImageRef、CGColorRef俩种数据类型是定义在CoreCraphics框架中
UIImage、UIColor是定义在UIKit中
QuartzCore框架和CoreGraphics框架是可以跨平台使用的,在iOS和Mac OS X上都能使用
- 但是UIKit只能在iOS中使用
- 为了保证可移植性,QuartzCore不能使用UIImage、UIColor,只能使用CGImageRef、CGColorRef
//创建
CALayer *layer = [CALayer layer];
//尺寸(默认和控件一样大)
layer.frame = CGRectMake(50, 50, 200, 200);
//颜色(默认是透明的)
layer.backgroundColor = [UIColor redColor].CGColor;
//设置图层图片
layer.contents = (id)([UIImage imageNamed:@"s.jpg"].CGImage);
//layer只能添加在layer上面
[self.view.layer addSublayer:layer];
UIView和CALayer的选择
- 通过CALayer,就能做出和UIView一样的界面效果
- 对比CALayer,UIView多了一个事件处理的功能,CALayer不能处理用户的触摸事件,而UIView可以
- 所有,如果显示出来的东西需要和用户进行交互的话,用UIView;如果不需要和用户交互,UIView和CALayer都可以
- CALayer的性能会高一些,因为它少了事件处理功能,更加轻量级
CALayer基本使用
通过操作CALayer对象,可以调整UIView的一些外观
- 阴影
- 圆角大小
- 边框宽度和颜色
//阴影(不透明度) self.testView.layer.shadowOpacity = 1; //偏移量 self.testView.layer.shadowOffset = CGSizeMake(10, -10); //阴影颜色 self.testView.layer.shadowColor = [UIColor yellowColor].CGColor; //阴影半径 self.testView.layer.shadowRadius = 10; // 圆角半径 self.testView.layer.cornerRadius = 50; //关于UIImageView //cornerRadius:设置控件的主层边框 self.testImageView.layer.cornerRadius = 50; //超出主层边框的内容全部裁剪掉 self.testImageView.layer.masksToBounds = YES; //设置边框 self.testImageView.layer.borderColor = [UIColor orangeColor].CGColor; self.testImageView.layer.borderWidth = 2;
给图层添加动画,实现一些效果
//x轴是上下翻转
//y轴是左右翻转
//z轴是中心转
self.testImageView.layer.transform = CATransform3DMakeRotation(M_PI, 1,1, 0);
//缩放
self.testImageView.layer.transform = CATransform3DMakeScale(0.5, 0.5, 1);
//利用KVC做缩放
//注:给对象的哪个属性赋值,就写到keyPath里面
//注:value的值一定是属性的类型才行
//KVC的好处:利用KVC可以快速的进行二维旋转和,宽,高同时缩放
[self.testImageView.layer setValue:@0.5 forKeyPath:@"transform.scale"];
//利用KVC做旋转
[self.testImageView.layer setValue:@0.5 forKeyPath:@"transform.rotation"];
position 和anchorPoint
- position
- 用来设置CALayer在父层中的位置
- 以父层的左上角为原点(0,0)
- anchorPoint(定位点、锚点)
- 决定CALayer身上的哪个点会在position属性所指的位置
- 以自己的左上角为原点(0,0)
- 它的x,y取值范围都是0~1,默认值(0.5,0.5)
- 一般旋转等动画都是按锚点来旋转的
关于anchorPoint的示意图
关于position 和anchorPoint的示意图
蓝色图层在红色图层上面,蓝色图层的position是(100,100)
1、当蓝色图层的anchorPoint是(0,0)时
2、当蓝色图层的anchorPoint是(0.5,0.5)时
3、当蓝色图层的anchorPoint是(1,1)时
4、当蓝色图层的anchorPoint是(0.5,0)时
隐式动画
- 每一个UIView内部都默认关联着一个CALayer,这个Layer层为Root Layer(根层)
- 所有的非Root Layer,也就是手动创建的CALayer对象,都存在隐式动画
- 什么是隐式动画
- 当对非Root Layer的部分属性进行修改时,不用添加动画,默认会产生一些动画效果
- 而这些属性称为animatable Properties(可动画属性)
- (void)setUp{
CALayer *layer = [CALayer layer];
layer.position = CGPointMake(200, 200);
layer.anchorPoint = CGPointZero;
layer.bounds = CGRectMake(0, 0, 150, 150);
layer.backgroundColor = [UIColor redColor].CGColor;
[self.view.layer addSublayer:layer];
_layer = layer;
}
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
_layer.transform = CATransform3DMakeRotation(M_PI, 0, 0, 1);
}