CAReplicatorLayer

CAReplicatorLayer 可以复制自己上面的子图层,一般用于图层倒影的实现。

其属性有如下:

instanceCount : 图层的复制个数

preservesDepth :

instanceDelay:后一个复制图层比前一个复制图层的动画延迟执行时间

instanceRedOffset:复制图层的颜色在red方向上的偏移

instanceGreenOffset:复制图层上的颜色在greed方向上的偏移

instanceBlueOffset:复制图层上的颜色在blue方向上的偏移

instanceAlphaOffset:复制图层能上在alpha通道上的偏移

使用该图层还能非常方便的实现一些有有规律重复运动的动画,比如水波纹的扩散动画、模仿音频播放的音轨动画等

1、模仿音频播放的音轨动画关键代码

- (void)configReplicatorLayer
{
    NSInteger count = CGRectGetWidth(self.frame) /(2 * self.layerMargin + layerWidth) ;
    CAReplicatorLayer * replicatorLayer = (CAReplicatorLayer *)self.layer;
    replicatorLayer.instanceCount = count;
    replicatorLayer.instanceColor = self.layerColor.CGColor;
    replicatorLayer.instanceTransform = CATransform3DMakeTranslation(self.layerMargin * 2 + layerWidth, 0, 0);
    replicatorLayer.preservesDepth = YES;
    replicatorLayer.instanceDelay = self.instanceDelay;
    replicatorLayer.instanceGreenOffset =  0.1;
}
- (void) initSubLayers
{
    self.animationLayer.frame = CGRectMake(self.layerMargin, 0, layerWidth, CGRectGetHeight(self.frame));
    self.animationLayer.anchorPoint = CGPointMake(0.5, 1);
    self.animationLayer.position = CGPointMake(layerWidth/2.0, CGRectGetHeight(self.frame));
    self.animationLayer.backgroundColor = [UIColor greenColor].CGColor;
    [self.layer addSublayer:self.animationLayer];
    self.animationLayer.transform = CATransform3DScale(self.animationLayer.transform, 1, 0.2, 1);

}

- (void)startAnimation
{
    if (_isAnimation){

        return ;
    }
    CABasicAnimation * basicAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale.y"];
    basicAnimation.toValue = @(1.0);
    basicAnimation.fromValue = @(0);
    basicAnimation.repeatCount = MAXFLOAT;
    basicAnimation.duration = self.duration;
    basicAnimation.autoreverses = YES;
    basicAnimation.removedOnCompletion = NO;
    basicAnimation.fillMode = kCAFillModeForwards;
    [self.animationLayer addAnimation:basicAnimation forKey:@"scale"];
    _isAnimation = YES;

}

2、 水波纹扩散动画关键动画

- (void) initSubLayers
{
    double r = MIN(CGRectGetWidth(self.frame), CGRectGetHeight(self.frame))/2.0;
    self.animationLayer.frame = CGRectMake(CGRectGetWidth(self.frame)/2.0 - r, CGRectGetHeight(self.frame)/2.0f - r, 2 *r, 2*r);
    UIBezierPath * path = [self drawCircle:r center:self.animationLayer.position];
    self.animationLayer.path = path.CGPath;
    self.animationLayer.transform = CATransform3DMakeScale(0, 0, 1);
    [self.layer addSublayer:self.animationLayer];
}

- (void)startAnimation{

    if (_isAnimation) {

        return;
    }
    CAAnimationGroup * group =  [[CAAnimationGroup alloc] init];
    group.duration = self.animationTime;
    group.repeatCount = MAXFLOAT;

    CABasicAnimation * basicAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale.xy"];
    basicAnimation.toValue = @(1);
    basicAnimation.duration = self.animationTime;
    basicAnimation.repeatCount = MAXFLOAT;


    CAKeyframeAnimation *opacityAnimation = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];
    opacityAnimation.duration = self.animationTime;
    opacityAnimation.values = @[@(0.3), @0.45,@0.6 ,@0];
    opacityAnimation.keyTimes = @[@0, @0.2,@0.7, @1];

    NSArray * animationArray = @[basicAnimation,opacityAnimation];
    group.animations = animationArray;
     [self.animationLayer addAnimation:group forKey:@"pulse"];
    _isAnimation = YES;
}
- (void)configReplicatorLayer
{
    CAReplicatorLayer * rlayer = (CAReplicatorLayer *)self.layer;
    rlayer.instanceDelay = self.instanceCount >0? self.animationTime/self.instanceCount:0;
    rlayer.instanceCount = self.instanceCount;
}

效果图如下 :截得是静态图。动画效果脑补

Last updated