CAReplicatorLayer

CAReplicatorLayer(复制层)

  • 父类是CALayer

CAReplicatorLayer所有独有属性

//复制实例数量(以加入到复制层的所有被复制对象组为一份)
@property NSInteger instanceCount;

//默认为NO,如果YES,使其实例遵守相同的限制
@property BOOL preservesDepth;

//延迟xx秒复制下一份实例
@property CFTimeInterval instanceDelay;
//实例间形变
@property CATransform3D instanceTransform;

//实例颜色,用处不大(被复制对象设置自身颜色即可)
@property(nullable) CGColorRef instanceColor;

//设置倒影属性
@property float instanceRedOffset;
@property float instanceGreenOffset;
@property float instanceBlueOffset;
@property float instanceAlphaOffset;

CAReplicatorLayer实现音量振动条

  • 实现方法步骤:
    1. 首先设置一个音量振动条
    • 为音量振动条增加不断伸缩的动画
    • 将音量振动条加入到复制层中,设置复制层属性,复制一定数量的形变等不一的音量振动条,形成先后的感觉(注意要将复制层加入到UIView的layer层中,并设置frame)
// 复制层
    // 复制层工作原理:它只会复制它的子层
    CAReplicatorLayer *repLayer = [CAReplicatorLayer layer];

    repLayer.frame = _contentView.bounds;

    // 复制instanceCount - 1份
    // 设置复制层里面的总份数
    repLayer.instanceCount = 5;

    // 设置复制层的形变,都是相对于上一个
    repLayer.instanceTransform = CATransform3DMakeTranslation(40, 0, 0);

    // 设置复制层动画延迟时间,也是相对于上一个
    repLayer.instanceDelay = 0.3;

//    repLayer.instanceAlphaOffset -= 0.3;

    [_contentView.layer addSublayer:repLayer];

    // 添加音量振动条
    CALayer *redLayer = [CALayer layer];

//    redLayer.frame = CGRectMake(0, 100, 30, 100);

    redLayer.anchorPoint = CGPointMake(0, 1);

    redLayer.position = CGPointMake(0, 200);

    redLayer.bounds = CGRectMake(0, 0, 30, 100);

    redLayer.backgroundColor = [UIColor redColor].CGColor;

    [repLayer addSublayer:redLayer];

    // 添加动画
    CABasicAnimation *anim = [CABasicAnimation animation];

    // 修改Layer的哪个属性
    anim.keyPath = @"transform.scale.y";

    // 设置修改的值
    anim.toValue = @0;

    anim.repeatCount = MAXFLOAT;

    anim.duration = .5;

    // 动画反转
    anim.autoreverses = YES;

    [redLayer addAnimation:anim forKey:nil];

CAReplicatorLayer实现活动指示器(效果是绿色点在圆中有规律的“此起彼伏”)

  • 实现方案一步骤(难点是想到粒子是伸缩而不是旋转):
    1. 首先设置一个矩形粒子
    • 为矩形粒子增加不断伸缩的动画(注意初始化伸缩为0)
    • 将矩形粒子加入到复制层中,设置复制层属性,复制一定数量的形变等不一的矩形粒子,形成先后的感觉(注意要将复制层加入到UIView的layer层中,并设置frame)
// 复制层
    CAReplicatorLayer *repLayer = [CAReplicatorLayer layer];
    repLayer.frame = _contentView.bounds;

    int count = 20;
    // 设置总分数
    repLayer.instanceCount = count;

    // 计算每个小块的占用的度数
    CGFloat angle = M_PI * 2 / count;
    repLayer.instanceTransform = CATransform3DMakeRotation(angle, 0, 0, 1);

    // 设置动画延长时间 = 动画时长 / 总个数
    repLayer.instanceDelay = 1.0 / count;
    [_contentView.layer addSublayer:repLayer];


    // 添加绿色块,到复制层
    CALayer *greenDot = [CALayer layer];
    greenDot.transform = CATransform3DMakeScale(0, 0, 0);//使所有粒子一开始不是都一同展示到屏幕中
    greenDot.frame = CGRectMake(70, 10, 10, 10);
    greenDot.backgroundColor = [UIColor greenColor].CGColor;
    [repLayer addSublayer:greenDot];

    // 添加动画
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"transform.scale";
    anim.fromValue = @1;//使所有粒子一开始不是都一同展示到屏幕中
    anim.toValue = @0;
    anim.repeatCount = MAXFLOAT;
    anim.duration = 1;
    [greenDot addAnimation:anim forKey:nil];

CAReplicatorLayer实现倒影(效果像是水中倒影)

//需要修改控制器的view的图层是复制层,才能复制UIImageView
###在VCView.m中
// 设置当前view的图层类型
+ (Class)layerClass
{
    return [CAReplicatorLayer class];
}

###vc.m中viewDidLoad方法:
    // 复制图片
    CAReplicatorLayer *repL = (CAReplicatorLayer *)self.view.layer;

    repL.instanceCount = 2;

    // 旋转,绕着父层的锚点旋转(图片层的锚点必须在中心点才能实现效果)
    repL.instanceTransform = CATransform3DMakeRotation(M_PI, 1, 0, 0);
##核心代码
    // 倒影
    repL.instanceRedOffset -= 0.1;
    repL.instanceGreenOffset -= 0.1;
    repL.instanceBlueOffset -= 0.1;
    repL.instanceAlphaOffset -= 0.1;
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容