CALayer-CAReplicatorLayer(复制图层)
2016-06-20 本文已影响3439人
SSBun
** 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,大家可以通过给图层设置图片,或者使用上一篇我们提到的CAGradientLayer来实现更加炫酷的动画
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)
}
}
