三.iOS贝塞尔曲线与CAReplicatorLayer详解

练习实现效果:

创建一个圆形layer并圆形映射多个,同时左旋转动画

挑战自我练习:


自己做一个柱状图并且做出音乐节奏动感动画

一.CAReplicatorLayer属性

@property NSInteger instanceCount;

要创建的拷贝数,可以做成动画

@property BOOL preservesDepth;

定义这个层是否将它的子层压平到它的平面上不(也就是说,它是否与转换层相似,默认NO)如果是,则应用标准限制(参见CATransformLayer.h

@property CFTimeInterval instanceDelay;

延时多久创建一个映射layer

@property CATransform3D instanceTransform;

创建映射的CATransform3D位置变化

@property(nullable) CGColorRef instanceColor;

在原对象的基础上添加的颜色,可做动画

@property float instanceRedOffset;

@property float instanceGreenOffset;

@property float instanceBlueOffset;


@property float instanceAlphaOffset;

在原对象基础颜色上做变化,可做动画

二.实现效果

1.创建CAReplicatorLayer对象并设置响应属性

CAReplicatorLayer *replicator = [CAReplicatorLayer layer];

replicator.frame = CGRectMake(0, 100, KScreen_W / 4.0f, KScreen_W / 4.0f);

[self.view.layer addSublayer:replicator];

//映射layer对象的次数

replicator.instanceCount = 10;

//创建CATransform3D对象设置位置依次变化

CATransform3D transform = CATransform3DIdentity;

//每次角度变化2*M_PI / 10 ,Z轴稍微变化为止否则会重叠

transform = CATransform3DRotate(transform, M_PI / 5.0, 0, 0, 0.001);

replicator.instanceTransform = transform;

//设置颜色渐变

replicator.instanceBlueOffset = -0.2;

replicator.instanceGreenOffset = -0.2;

2.创建源对象,并设置给CAReplicatorLayer对象

UIBezierPath *bezierPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(KScreen_W / 8.0f - 2.5, 20.0f, 5.0f, 5.0f)];

maskLayer = [CAShapeLayer layer];

maskLayer.fillColor = [UIColor redColor].CGColor;

maskLayer.path = bezierPath.CGPath;

maskLayer.fillColor = [UIColor colorWithWhite:0.9 alpha:1].CGColor;

maskLayer.fillRule = kCAFillRuleEvenOdd;

[replicator addSublayer:maskLayer];

3.做旋转动画

CABasicAnimation* rotationAnimation;

rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];

rotationAnimation.toValue = [NSNumber numberWithFloat: M_PI / 10 - 0.001 ];

rotationAnimation.duration = 0.05;

rotationAnimation.cumulative = YES;

rotationAnimation.repeatCount = CGFLOAT_MAX;

[replicator addAnimation:rotationAnimation forKey:@"aa"];

Copyright © 2017年ZaneWangWang. All rights reserved.

持续更新中...

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容