可复制图层CAReplicatorLayer

2017-04-27  本文已影响24人  Maggie的小蜗居

CAReplicatorLayer的作用是高效生成相似的图层。它会复制出多个子图层,并且在每个复制图层上面应用不同的变换,动画。

1 . 基本属性简介

@property NSInteger instanceCount; //需要复制图层的个数
@property BOOL preservesDepth; //是否与CATransformLayer保持一样的性质,默认是NO
@property CFTimeInterval instanceDelay;  //延迟的时间 ,在每个图层上做动画的时候需要用到
@property CATransform3D instanceTransform; //作用于每个图层上面的变换
@property(nullable) CGColorRef instanceColor;  // 设置多个复制图层的颜色,默认位白色
---------------------------------------------------
设置每个复制图层相对上一个复制图层的颜色偏移量
@property float instanceRedOffset;
@property float instanceGreenOffset;
@property float instanceBlueOffset;
---------------------------------------------------
@property float instanceAlphaOffset;  //每个复制图层相对上一个图层透明度的衰减

2.使用CAReplicatorLayer简单模拟水波纹外扩

  //做动画的图层
    CAShapeLayer *layer = [CAShapeLayer layer];
//    layer.backgroundColor = [UIColor redColor].CGColor;
    layer.frame = CGRectMake(0, 0, 20, 20);
    layer.position = CGPointMake(25, 25);
    layer.fillColor = [UIColor clearColor].CGColor;
    layer.borderWidth = 1;
    layer.borderColor = [UIColor redColor].CGColor;
    layer.cornerRadius = 10;

    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
    animation.duration = 2;
    animation.repeatCount = MAXFLOAT;
    animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(10, 10, 1)];

    
    CABasicAnimation *opacityAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
    opacityAnimation.duration = 2;
    opacityAnimation.repeatCount = MAXFLOAT;
    opacityAnimation.toValue = @(0);
    opacityAnimation.fromValue = @(1);

    CAAnimationGroup *group = [[CAAnimationGroup alloc] init];
    group.animations = @[animation,opacityAnimation];
    group.repeatCount = MAXFLOAT;
    group.duration = 2;
    [layer addAnimation:group forKey:@"dsd"];
    
  //创建一个可复制图层
    CAReplicatorLayer *replicator = [CAReplicatorLayer layer];
    replicator.frame = CGRectMake(0, 0, 50, 50);
    [self.layer addSublayer:replicator];
    replicator.instanceCount = 3;
    replicator.instanceDelay = 0.3;
//    replicator.instanceAlphaOffset = -0.3;
    [replicator addSublayer:layer];

1.gif
上一篇 下一篇

猜你喜欢

热点阅读