iOS quartzCore学习之CAReplicatorLayer 的使用

转自：http://www.jianshu.com/p/3e3fde03c937

CAReplicatorLayer可以复制自己子层的layer,并且复制的出来的layer和原来的子layer拥有相同的动效。然后通过设置一些属性，就可以完成很酷的效果，非常强大。。

先看效果

代码如下：

+ (CALayer *)replicatorLayer_Heart{
    CGFloat swidth = [UIScreen mainScreen].bounds.size.width;
    UIBezierPath *tPath = [UIBezierPath bezierPath];
    [tPath moveToPoint:CGPointMake(swidth/2.0, 200)];
    [tPath addQuadCurveToPoint:CGPointMake(swidth/2.0, 400) controlPoint:CGPointMake(swidth/2.0 + 200, 20)];
    [tPath addQuadCurveToPoint:CGPointMake(swidth/2.0, 200) controlPoint:CGPointMake(swidth/2.0 - 200, 20)];
    [tPath closePath];
    
    CAShapeLayer* shape = [CAShapeLayer layer];
    // 这里的frame 位置
    shape.frame = CGRectMake(0, 0, 10, 10);
    shape.cornerRadius = 5;
    // 这里的path 必须设置，否则显示不正确图片
    shape.path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 10, 10)].CGPath;
    shape.fillColor = [UIColor redColor].CGColor;
  
    
    CAKeyframeAnimation *loveAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    loveAnimation.path = tPath.CGPath;
    loveAnimation.duration = 4;
    loveAnimation.repeatCount = MAXFLOAT;

    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    animationGroup.animations = @[[WHAnimation alphaAnimation],loveAnimation];
    animationGroup.duration = 3.0;
    animationGroup.autoreverses = NO;
    animationGroup.repeatCount = HUGE;
    [shape addAnimation:animationGroup forKey:@"animationGroup"];

    
//    [shape addAnimation:loveAnimation forKey:@"loveAnimation"];
    
    CAReplicatorLayer* _loveLayer = [CAReplicatorLayer layer];
    _loveLayer.frame = CGRectMake(0, 0, 10, 10);
    _loveLayer.position = CGPointMake(0, 0);
    _loveLayer.instanceCount = 40;                // 复制39个子layer+原本的子layer共40个layer
    _loveLayer.instanceDelay = 0.2;               // 每隔0.2出现一个layer
    [_loveLayer addSublayer:shape];
    return _loveLayer;
}

 

2. 其他效果

代码如下：

+ (CALayer*)replicatorLayer_Circle{
    CAShapeLayer* shape = [CAShapeLayer layer];
    shape.frame = CGRectMake(0, 0, 80, 80);
    shape.path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 80, 80)].CGPath;
    shape.fillColor = [UIColor redColor].CGColor;
    shape.opacity = 0;
    
    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    animationGroup.animations = @[[WHAnimation alphaAnimation],[WHAnimation scaleAnimation]];
    animationGroup.duration = 4.0;
    animationGroup.autoreverses = NO;
    animationGroup.repeatCount = HUGE;
    [shape addAnimation:animationGroup forKey:@"animationGroup"];
    
    CAReplicatorLayer *replicatorLayer = [CAReplicatorLayer layer];
    replicatorLayer.frame = CGRectMake(0, 0, 80, 80);
    replicatorLayer.instanceDelay = 0.5;
    replicatorLayer.instanceCount = 8;
    [replicatorLayer addSublayer:shape];
    return replicatorLayer;
}

3.波浪

 

代码如下：

+ (CALayer *)replicatorLayer_Wave{
    CGFloat between = 5.0;
    CGFloat radius = (100-2*between)/3;
    CAShapeLayer *shape = [CAShapeLayer layer];
    shape.frame = CGRectMake(0, (100-radius)/2, radius, radius);
    shape.path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, radius, radius)].CGPath;
    shape.fillColor = [UIColor redColor].CGColor;
    [shape addAnimation:[WHAnimation scaleAnimation1] forKey:@"scaleAnimation"];
    
    CAReplicatorLayer *replicatorLayer = [CAReplicatorLayer layer];
    replicatorLayer.frame = CGRectMake(0, 0, 100, 100);
    replicatorLayer.instanceDelay = 0.2;
    replicatorLayer.instanceCount = 3;
    // 设置位移偏差
    replicatorLayer.instanceTransform = CATransform3DMakeTranslation(between*2+radius,0,0);
    [replicatorLayer addSublayer:shape];
    
    return replicatorLayer;
}

公用部分代码：

+ (CABasicAnimation *)alphaAnimation{
    CABasicAnimation *alpha = [CABasicAnimation animationWithKeyPath:@"opacity"];
    alpha.fromValue = @(1.0);
    alpha.toValue = @(0.0);
    return alpha;
}

+ (CABasicAnimation *)scaleAnimation{
    CABasicAnimation *scale = [CABasicAnimation animationWithKeyPath:@"transform"];
    scale.fromValue = [NSValue valueWithCATransform3D:CATransform3DScale(CATransform3DIdentity, 0.0, 0.0, 0.0)];
    scale.toValue = [NSValue valueWithCATransform3D:CATransform3DScale(CATransform3DIdentity, 1.0, 1.0, 0.0)];
    return scale;
}