CALayer和核心动画
CALayer和UIView(CA框架)
- CALayer是View内的图层,现实图案等内容其实在这里面.(效率更快,不耗CUP)
- UIView只负责监听和点击事件
CALayer的基本属性
首先CA开头的类,是属于CG框架,UI属性都要进行类型转换.
- position和bounds(图层建议使用bounds,不使用frame)位置和大小
- contents内容(可显示图片,注意类型转换为.CGImage.
redView.layer.contents = (__bridge id _Nullable)([UIImage imageNamed:@"CALayer2"].CGImage);
- backgroundColor背景色
- border边框(边框颜色borderColor,边框宽度borderWidth)
- shadow阴影,四个属(shadowColor阴影颜色,shadowOffset阴影偏移量,shadowRadius高斯半径)一起出现才能显示,且阴影不透明度(shadowOpacity)要为1(默认为0).
- ** cornerRadius (边角弧度), maskToBounds 是否裁剪成对存在**
- ** opacity ** 不透明度
- ** transform **仿射变换
只有layer下核心动画是假象,位置不发生改变.layer的transform位置也是发生改变的.
单独创建Layer显示
Layer特点:自带隐式动画,跟Layer除外,但可以手动关闭:
- 开始事物
- 设置行为不实现
- 写你要实现的动画
- 提交事务
//开启事物
// [CATransaction begin];
//设置事物为不实现行为
// [CATransaction setDisableActions:YES];
self.layer.position = CGPointMake(100, 400);
//提交事物
// [CATransaction commit];```
1. 创建CALayer对象.
2. 设置Layer对象的属性(使我们能看见)
3. 添加到父Layer中
``` [self.view.layer addSublayer:layer]; ```
#### transform属性(仿射变换)
//旋转(3D),理解3d旋转 ,在Z轴上旋转常见,常用)
self.layer.transform = CATransform3DRotate(self.layer.transform, M_PI_2, 0, 0, 1);
//缩放(只能在x,y轴缩放,因为Z轴平移缩放视觉无法发现)
self.layer.transform = CATransform3DScale(self.layer.transform, 0.8, 0.8, 1);
//平移(只能在x,y轴缩放,因为Z轴平移缩放视觉无法发现)
self.layer.transform = CATransform3DTranslate(self.layer.transform, 10, 10, 0);
#### Layer时钟动画
知识点1:anchorPoint锚点和position位置,之间的关系
anchorPoint锚点(定点),范围(0~1)决定Layer以锚点比例存在的位置,0,0在左下,默认在中心,0.5,0.5.
知识点2:CADisplayLink刷帧定时器,每秒刷新频率60次.
CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"position"];
KeyPath参数transform.rotation 就是旋转关键字
CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(move)];
[link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
知识点3:根据日历显示当前时间
1. 获取时间对象(NSDate)
2. 获取当前日历对象( NSCalendar )
3. 根据日历获取当前秒数
> NSInteger second = [calender component:NSCalendarUnitSecond fromDate:date];
1. 通过图层显示时针
2. 裁剪
3. 制作秒针(修改锚点位置)
4. 设置刷帧定时器(调用方法)
5. 方法内实现秒针,旋转.
Layer的核心动画(真实位置不发生改变).
动画设置代理(隐式代理,不用遵守代理协议,这个协议作为代理的分类了)
> CABasicAnimation 基本动画,可以实现平移翻转,缩放的动画
> CAKeyframeAnimation 关键帧动画,通过帧的形式播放动画,可以有多个点 values属性
> CAAnimationGroup 组动画,内部可以有多个动画为一组播放.animations 属性
> CATransition 转场动画
动画的不返回属性
basic.removedOnCompletion = NO;
basic.fillMode =
1. 转场动画需要手势storyBoard拖入轻扫手势.(需要几个拖几个手势对象),加入到View的手势中
2. 判断手势方向,显示图片内容
3. 创建转场动画
> //设置属性
transition.type = kCATransitionFade;//转场方式
transition.subtype = kCATransitionFromRight;那个方向显示转场方式.
4. 加入到图层Layer中
#### 小画板案例
1. 搭建界面
2. 先画单线
1. touchBegin取出起始点,绘制路径,保存路径(属性接收touchMove中要用)
2. touchMove中添加线条.重绘
3. drawRect系统方法中渲染.
3. 画多线:思路,多线就需要保存多组路径,且首尾不想连.所以需要路径数组
1. 创建路径可变数组(记住实例化,可懒加载,也可awakeNIb中写.
2. 将起始点路径加入到这个数组中(touchBegin),根绝这个路径添加线
3. 改变单条路径渲染为遍历数组渲染.
3. 改变线的颜色,粗细
1. 同过slider的的值传递到View中(属性),更改线粗为属性值
2. 传递点击按钮的背景颜色到内部.内部定以UIColor属性,但是UIBezier内没有线的颜色属性(怎么给这个路径对象这个属性呢??直接创建一个类继承UIBezier,我们在内部给他定义这个UIColor属性,更改路径为你自定义的这个类,给他UIColor属性设置为外界传进来的颜色),给你的每个路径设置颜色.
4. 实现各个按钮的点击事件(记住原则控制器不关心内部实现,自己的事情自己做,他只负责调用方法.
1. 清除按钮清除集合中的路径
2. 返回:清除上一个元素
3. 擦除:用画板的背景色在绘制这个颜色覆盖原来的颜色
4. 保存图片
- 开启图片上下文 UIGraphicsBeginImageContextWithOptions(self.myPaintView.bounds.size, NO, 0);
- 获取当前上下文,因为截屏需要获取上下文(整个就不用了) CGContextRef ctx = UIGraphicsGetCurrentContext();
- 截图 [self.myPaintView.layer renderInContext:ctx];
- 获取截图 UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
- 关闭上下文 UIGraphicsEndImageContext();
- 保存到相册 UIImageWriteToSavedPhotosAlbum(newImage, nil, nil, nil);
