CAReplicatorLayer可以将自己的子图层复制指定的次数,并且复制体会保持被复制图层的各种基础属性以及动画
基本属性
- instanceCount
var instanceCount: Int拷贝图层的次数,包括其所有的子图层,默认值是1,也就是没有任何子图层被复制 - instanceDelay
var instanceDelay: CFTimeInterval在短时间内的复制延时,一般用在动画上(支持动画的延时) - instanceTransform
var instanceTransform: CATransform3D复制图层在被创建时产生的和上一个复制图层的位移(位移的锚点时CAReplicatorlayer的中心点) - preservesDepth
var preservesDepth: Bool如果设置为YES,图层将保持于CATransformLayer类似的性质和相同的限制
- instanceColor
var instanceColor: CGColor?设置多个复制图层的颜色,默认位白色 - instanceRedOffset
var instanceRedOffset: Float设置每个复制图层相对上一个复制图层的红色偏移量 - instanceGreenOffset
var instanceGreenOffset: Float设置每个复制图层相对上一个复制图层的绿色偏移量 - instanceBlueOffset
var instanceBlueOffset: Float设置每个复制图层相对上一个复制图层的蓝色偏移量 - instanceAlphaOffset
var instanceAlphaOffset: Float设置每个复制图层相对上一个复制图层的透明度偏移量
实例
首先我们来实现一个类似于雷达的动画,想必大家都见过这样的动画,其实使用复制图层实现起来特别的简单,这是一个比较简单的Demo,大家可以通过给图层设置图片,或者使用上一篇我们提到的来实现更加炫酷的动画
CAReplicatorLayer.gif
//// ViewController.swift// CAReplicatorLayer//// Created by 蔡士林 on 6/17/16. // Copyright © 2016 BZ. All rights reserved. // import UIKit class ViewController: UIViewController { var replicatorLayer:CAReplicatorLayer! let kWidth = UIScreen.mainScreen().bounds.size.width override func viewDidLoad() { super.viewDidLoad() setupUI() } func setupUI() { let animationView = UIView() // 创建一个背景视图 animationView.bounds = CGRectMake(0, 0, kWidth, 200) animationView.center = self.view.center self.view.addSubview(animationView) animationView.backgroundColor = UIColor.lightGrayColor() animationView.clipsToBounds = true let animationLayer = CAShapeLayer() 动画图层,就是不停变大的那个圆 animationLayer.backgroundColor = UIColor.redColor().CGColor animationLayer.bounds = CGRectMake(0, 0, 20, 20) animationLayer.cornerRadius = 10 animationLayer.position = CGPointMake(kWidth/2, 100) // 放大的动画 let transformAnim = CABasicAnimation(keyPath: "transform") let value = NSValue.init(CATransform3D: CATransform3DMakeScale(10, 10, 1)) transformAnim.toValue = value transformAnim.duration = 2 // 透明度动画(其实也可以直接设置CAReplicatorLayer的instanceAlphaOffset来实现) let alphaAnim = CABasicAnimation(keyPath: "opacity") alphaAnim.toValue = 0 alphaAnim.duration = 2 let animGroup = CAAnimationGroup() animGroup.animations = [transformAnim,alphaAnim] animGroup.duration = 2 animGroup.repeatCount = HUGE animationLayer.addAnimation(animGroup, forKey: nil) replicatorLayer = CAReplicatorLayer() replicatorLayer.addSublayer(animationLayer); replicatorLayer.instanceCount = 3 //三个复制图层 replicatorLayer.instanceDelay = 0.3 // 复制间隔0.3秒 animationView.layer.addSublayer(replicatorLayer) } } 接下来介绍几个加载动画的用法~
CAReplicatorLayer_2.gif
//// ViewController.swift// CAReplicatorLayer// // Created by 蔡士林 on 6/17/16. // Copyright © 2016 BZ. All rights reserved. // import UIKit class ViewController: UIViewController { var replicatorLayer:CAReplicatorLayer! let kWidth = UIScreen.mainScreen().bounds.size.width override func viewDidLoad() { super.viewDidLoad() setupUI() } func setupUI() { let animationView = UIView() animationView.bounds = CGRectMake(0, 0, kWidth, 300) animationView.center = self.view.center self.view.addSubview(animationView) animationView.backgroundColor = UIColor.lightGrayColor() animationView.clipsToBounds = true let animationLayer = CAShapeLayer() animationLayer.backgroundColor = UIColor.redColor().CGColor animationLayer.bounds = CGRectMake(0, 0, 20, 20) animationLayer.anchorPoint = CGPointMake(0.5, 0.5) animationLayer.position = CGPointMake(0, animationView.center.y) animationLayer.cornerRadius = 10 let path = CGPathCreateMutable() // 创建转圈的动画 CGPathAddEllipseInRect(path, nil, CGRectMake((animationView.bounds.size.width-160)/2, (animationView.bounds.size.height-160)/2, 160, 160)) let transformAnim = CAKeyframeAnimation(keyPath: "position") transformAnim.duration = 4 transformAnim.repeatCount = HUGE transformAnim.path = path animationLayer.addAnimation(transformAnim, forKey: nil) replicatorLayer = CAReplicatorLayer() replicatorLayer.addSublayer(animationLayer); replicatorLayer.repeatCount = HUGE replicatorLayer.instanceCount = 20 replicatorLayer.instanceDelay = 0.2 // 动画延迟 replicatorLayer.instanceAlphaOffset = -0.05 // 透明度递减 animationView.layer.addSublayer(replicatorLayer) } } 另一个炫酷的动画,带大小缩放的动画
CAReplicatorLayer_3.gif
//// ViewController.swift// CAReplicatorLayer// // Created by 蔡士林 on 6/17/16. // Copyright © 2016 BZ. All rights reserved. // import UIKit class ViewController: UIViewController { var replicatorLayer:CAReplicatorLayer! let kWidth = UIScreen.mainScreen().bounds.size.width override func viewDidLoad() { super.viewDidLoad() setupUI() } func setupUI() { let animationView = UIView() animationView.bounds = CGRectMake(0, 0, kWidth, 300) animationView.center = self.view.center self.view.addSubview(animationView) animationView.backgroundColor = UIColor.grayColor() animationView.clipsToBounds = true let animationLayer = CAShapeLayer() animationLayer.backgroundColor = UIColor.redColor().CGColor animationLayer.bounds = CGRectMake(0, 0, 20, 20) animationLayer.position = CGPointMake(self.view.bounds.size.width/2, 50) animationLayer.borderColor = UIColor.whiteColor().CGColor animationLayer.cornerRadius = 2 animationLayer.borderWidth = 1 animationLayer.transform = CATransform3DMakeScale(0.1, 0.1, 0.1) let transformAnim = CABasicAnimation(keyPath: "transform") transformAnim.duration = 2 transformAnim.repeatCount = HUGE transformAnim.fromValue = NSValue.init(CATransform3D: CATransform3DMakeScale(1, 1, 1)) transformAnim.toValue = NSValue.init(CATransform3D: CATransform3DMakeScale(0.1, 0.1, 0.1)) animationLayer.addAnimation(transformAnim, forKey: nil) replicatorLayer = CAReplicatorLayer() replicatorLayer.frame = CGRectMake(0, 0, self.view.bounds.size.width, 300) replicatorLayer.addSublayer(animationLayer); replicatorLayer.instanceCount = 20 replicatorLayer.instanceDelay = 0.1 let angle = CGFloat(2*M_PI) / CGFloat(20) replicatorLayer.instanceTransform = CATransform3DMakeRotation(angle, 0, 0, 1.0) animationView.layer.addSublayer(replicatorLayer) } }