前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >CAReplicatorLayer复制Layer和动画, 实现神奇的效果

CAReplicatorLayer复制Layer和动画, 实现神奇的效果

作者头像
周希
发布2019-10-15 01:17:04
8300
发布2019-10-15 01:17:04
举报
文章被收录于专栏:APP自动化测试APP自动化测试

今天我们看下CAReplicatorLayer, 官方的解释是一个高效处理复制图层的中间层。他能复制图层的所有属性包括动画

一样我们先看下头文件

代码语言:javascript
复制
@interface CAReplicatorLayer : CALayer

@property NSInteger instanceCount;
//复制的个数
@property BOOL preservesDepth;
//这是一个bool值,默认为No,如果设为Yes,将会具有3维透视效果
@property CFTimeInterval instanceDelay;
//复制后的layer相比原来的距离
@property CATransform3D instanceTransform;
//复制layer的坐标系/方向偏转 
@property(nullable) CGColorRef instanceColor;

@property float instanceRedOffset;
@property float instanceGreenOffset;
@property float instanceBlueOffset;
@property float instanceAlphaOffset;

@end

我们可以通过CAReplicatorLayer实现很炫的动画, 比如这个

上代码:

代码语言:javascript
复制
#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    
    [super viewDidLoad];
    
    //创建一个红色的圆形CALayer
    CALayer * layer       = [CALayer layer];
    layer.bounds          = CGRectMake(0, 0, 30, 30);
    layer.position        = CGPointMake(self.view.center.x - 50, self.view.center.y - 50);
    layer.backgroundColor = [UIColor redColor].CGColor;
    layer.cornerRadius    = 15;
    [self.view.layer addSublayer:layer];
    
    //创建一个透明度动画
    CABasicAnimation * animation1 = [CABasicAnimation animationWithKeyPath:@"opacity"];
    animation1.fromValue          = @(0);
    animation1.toValue            = @(1);
    animation1.duration           = 1.5;
    animation1.autoreverses       = YES;
    
    //创建一个缩放动画
    CABasicAnimation * animation2 = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    animation2.toValue            = @(1.5);
    animation2.fromValue          = @(0.5);
    animation2.duration           = 1.5;
    animation2.autoreverses       = YES;
    
    //创建一个动画组, 将之前创建的透明度动画和缩放动画加入到这个动画组中
    CAAnimationGroup * ani = [CAAnimationGroup animation];
    ani.animations         = @[animation1,animation2];
    ani.duration           = 1.5;
    ani.repeatCount        = MAXFLOAT;
    ani.autoreverses       = YES;
    
    //将动画组添加到layer
    [layer addAnimation:ani forKey:nil];
    
    CAReplicatorLayer * rec = [CAReplicatorLayer layer];
    rec.instanceCount       = 3;
    rec.instanceDelay       = 0.5;
    rec.instanceTransform   = CATransform3DMakeTranslation(50, 0, 0);
    [rec addSublayer:layer];
    [self.view.layer addSublayer:rec];
    
    CAReplicatorLayer * rec2 = [CAReplicatorLayer layer];
    rec2.instanceCount       = 3;
    rec2.instanceDelay       = 0.5;
    rec2.instanceTransform   = CATransform3DMakeTranslation(0, 50, 0);
    [rec2 addSublayer:rec];
    [self.view.layer addSublayer:rec2];
}

@end

利用CAReplicatorLayer可以实现很多神奇的效果, 大家可以在发挥下脑洞

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2017-01-18 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档