CALayer的多个子Layer

2016-07-29  本文已影响0人  任性不认命ToT

一、CAReplicatorLayer


CAReplicatorLayer 介绍

CAReplicatorLayer继承于CALayer,CAReplicatorLayer是一种layer复制手段,

注意!一定要设置CAReplicatorLayerframe,因为instanceTransform属性都是根据framecenter作为基准的


CAReplicatorLyer 的属性
属性 作用
instanceCount 子layer复制的个数
instanceDelay 在子layer进行动画的前提下,下一个复制layer的动画执行延迟
instanceTransform 子layer相对于前一个复制layer的形变属性
instanceRedOffset 子layer相对于前一个复制layer的颜色属性
instanceGreenOffset 子layer相对于前一个复制layer的颜色属性
instanceBlueOffset 子layer相对于前一个复制layer的颜色属性
instanceAlphaOffset 子layer相对于前一个复制layer的透明系数

instanceTransform使用细节
1.在使用CATransform3DRotate的时候,CAReplicatorLayerframe一定要设置成子layer一样的size,否则计算会非常麻烦;并且在旋转后,参考系也跟随旋转。
2.在为子layer添加动画的时候,也要考虑到变换的参考系。

示例:假如子layer是一个圆形layer,而我想实现一个正三角排布,下面这个instanceTransform的含义是,下一个复制layer会在上一个layer的参考系上先向x轴平移50像素,然后将参考系旋转120°,因为子layersize_rlsize相同,所以旋转以后子layer的位置并没有改变(如果size不同,则两个子layer的中心和_rl的中心诚成120°角),仅仅是改变了参考系(当前子layer的x轴在上一个子layer参考系的x轴的顺时针120°方向)

@property (nonatomic, strong) CAReplicatorLayer *rl;   

/** 子layer实现 */
CAShapeLayer *shape = [CAShapeLayer layer];       
shape.frame = CGRectMake(0, 0, 25, 25);
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 25, 25)];
shape.path = path.CGPath;
shape.fillColor = [UIColor blackColor].CGColor;

/** CAReplicatorLayer的实现 */
_rl = [[CAReplicatorLayer alloc] init];
_rl.frame = CGRectMake(100, 100, 25, 25);
_rl.backgroundColor = [UIColor cyanColor].CGColor;
_rl.instanceDelay = 0.0;    // 动画延迟秒数
_rl.instanceCount = 3;    // 子layer复制数
CATransform3D t = CATransform3DTranslate(CATransform3DIdentity, 50, 0, 0);
t = CATransform3DRotate(t ,120 / 180.0 * M_PI, 0, 0, 1);
_rl.instanceTransform = t;
_rl.instanceAlphaOffset = -0.4;    // 设置透明系数是方便看复制layer的层次
[_rl addSublayer:shape];
[self.view.layer addSublayer:_rl];
正三角复制层贴图

二、CAGradientLayer


CAGradientLayer 介绍

CAGradientLayer继承于CALayer,CAGradientLayer是一种渐变的图层


CAGradientLayer 的属性
属性 作用
colors 渐变色数组
locations 渐变色位置数组,数量与colors相同,且下一个数组元素要>=前一个元素,且均在0~1之间
startPoint 开始位置,默认(0.5,0)
endPoint 结束位置,默认(0.5,1)

** locations**属性详解
locations元素数要等于colors数量,比如colors中有三种颜色,且设置locations的元素为@[@0.1, @0.3, @0.9],且没有改变startPoint、endPoint属性,那么在layer的y轴范围内,0-0.1的范围内全部显示第一种颜色;在0.1-0.3的范围内慢慢由第一种颜色和第二种颜色混合,且慢慢变为第二种颜色,0.3位置处全部为第二种颜色;0.3-0.9的范围内慢慢由第二种和第三种颜色混合,且慢慢变成第三种颜色;0.9-1全部为第三种颜色

/** 渐变 */
_gl = [CAGradientLayer layer];
_gl.frame = self.view.frame;
_gl.opaque = 0.5;
_gl.colors = @[(id)[UIColor redColor].CGColor,(id)[UIColor cyanColor].CGColor,(id)[UIColor greenColor].CGColor,];
_gl.locations = @[@0.1, @0.3, @0.9];
[self.view.layer addSublayer:_gl];
渐变色贴图

三、CAShapeLayer

CAShapeLayer之前已经写过一篇了,从这里过去


三、CAEmitterLayer(粒子效果)

较复杂,等有时间了在细细品味@!

上一篇下一篇

猜你喜欢

热点阅读