美文网首页
iOS CAReplicatorLayer复制层的基本用法

iOS CAReplicatorLayer复制层的基本用法

作者: 丹丹十个胆小鬼 | 来源:发表于2019-01-15 17:53 被阅读0次

CAReplicatorLayer复制层需要批量复制一些图层时使用,复制它里面的所有子层。
属性说明:

  • instanceCount:表示原来层中的所有子层复制的份数,包括第一个加入层

  • instanceDelay;相对于上一个层的动画延时

  • instanceTransform:对复制出来的子层做形变操作(相对于复制出来的上一个图层进行形变.)

  • instanceRedOffset:对复制出来的子层三基色进行修改

  • instanceAlphaOffset:透明度
    效果如下:
    类似音乐震动条效果:

    复制层
    //复制层(可以复制里面的子层)
    CAReplicatorLayer *repL = [CAReplicatorLayer layer];
    repL.frame = self.contentView.bounds;
    // 把复制层添加到view的layer
    [self.contentView.layer addSublayer:repL];
    
    
    // 自定义一个layer
    CALayer *layer = [CALayer layer];
    CGFloat H = 150;
    //CGFloat Y = self.contentView.bounds.size.height - H;
    layer.bounds = CGRectMake(0, 0, 30, H);
    layer.anchorPoint = CGPointMake(0, 1);
    layer.position = CGPointMake(0, self.contentView.bounds.size.height);
    
    layer.backgroundColor = [UIColor redColor].CGColor;
    // 把自定义layer添加到复制层
    [repL addSublayer:layer];
    
    //添加动画
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"transform.scale.y";
    anim.toValue = @0;
    anim.repeatCount = HUGE;
    anim.duration  = 1.0;
    anim.autoreverses = YES;
    [layer addAnimation:anim forKey:nil];
    
    
    //复制的份数.(包括它自己)
    repL.instanceCount = 5;
    
    //动画延时执行时间
    repL.instanceDelay = 1.0;
        //对复制出来的子层颜色进行修改
    replicatorL.instanceRedOffset -= 0.1;
    replicatorL.instanceBlueOffset -= 0.1;
    replicatorL.instanceGreenOffset -= 0.1;
    
    //对复制出来的子层做形变操作(相对于复制出来的上一个图层进行形变.)
    repL.instanceTransform  = CATransform3DMakeTranslation(45, 0, 0);

如何实现如下的粒子动画效果


效果图

实现思路:

  • 1、现在View上创建path,并渲染
  • 2、创建红色粒子图层,并根据path进行动画
  • 3、使用复制层,复制多个红色layer
#import "VCView.h"

@interface VCView ()
/** */
@property (strong, nonatomic) UIBezierPath *path;

/** 粒子层*/
@property (strong, nonatomic) CALayer *redCircleL;

@end

@implementation VCView


/**
 设置View的根层为复制层
 */
+ (Class)layerClass {
    return [CAReplicatorLayer class];
}

- (void)drawRect:(CGRect)rect {
    [self.path stroke];
    
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    UITouch *touch = [touches anyObject];
    CGPoint currP = [touch locationInView:self];
    UIBezierPath *path = [UIBezierPath bezierPath];
    self.path = path;
    [path moveToPoint:currP];
}

- (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    
    UITouch *touch = [touches anyObject];
    CGPoint currP = [touch locationInView:self];
    [self.path addLineToPoint:currP];
    [self setNeedsDisplay];
}

- (void)awakeFromNib {
    [super awakeFromNib];
    
    // 红色粒子
    CALayer *redCircleL = [CALayer layer];
    // -10:为了一开始不在屏幕上显示红色粒子
    redCircleL.frame = CGRectMake(-10, 0, 10, 10);
    redCircleL.backgroundColor = [UIColor redColor].CGColor;
    redCircleL.cornerRadius = 5;
    [self.layer addSublayer:redCircleL];
    self.redCircleL = redCircleL;
    
    // 获取view的根层,即复制层
    CAReplicatorLayer *replicatorL = (CAReplicatorLayer *)self.layer;
    replicatorL.instanceCount = 10;
    replicatorL.instanceDelay = 0.25;
    
}
// 开始动画
- (void)start{
    // 在红色粒子中添加帧动画
    CAKeyframeAnimation *keyframeAnim = [CAKeyframeAnimation animation];
    keyframeAnim.path = self.path.CGPath;
    keyframeAnim.keyPath = @"position";
    
    keyframeAnim.duration = 2;
    keyframeAnim.repeatCount = MAXFLOAT;
    [self.redCircleL addAnimation:keyframeAnim forKey:nil];
    
//    replicatorL.transform =
    
}
//重绘
- (void)reDraw{
    // 删除动画
    [self.redCircleL removeAllAnimations];
    // 清空路径中所有的点
    [self.path removeAllPoints];
    // 重绘
    [self setNeedsDisplay];
}

@end

相关文章

网友评论

      本文标题:iOS CAReplicatorLayer复制层的基本用法

      本文链接:https://www.haomeiwen.com/subject/vdoydqtx.html