CAShapeLayer 圓形指示器
let ovalShapeLayer: CAShapeLayer = CAShapeLayer()
let anotherOvalShapeLayer: CAShapeLayer = CAShapeLayer()
override func viewDidLoad() {
super.viewDidLoad()
loadingIndicator()
beginSimpleAnimation()
complexLoadingIndicator()
complexAnimations()
}
// MARK: - 簡單的加載指示器
func loadingIndicator() {
ovalShapeLayer.strokeColor = UIColor.white.cgColor
ovalShapeLayer.fillColor = UIColor.clear.cgColor
ovalShapeLayer.lineWidth = 7
let ovalRadius = loadingView.bounds.size.height / 2.0 * 0.8
ovalShapeLayer.path = UIBezierPath(ovalIn: CGRect(x: loadingView.frame.size.width/2 - ovalRadius, y: loadingView.frame.size.height/2 - ovalRadius, width: ovalRadius * 2, height: ovalRadius * 2)).cgPath
ovalShapeLayer.strokeEnd = 0.4
ovalShapeLayer.lineCap = kCALineCapRound
loadingView.layer.addSublayer(ovalShapeLayer)
}
func beginSimpleAnimation() {
let rotate = CABasicAnimation(keyPath: "transform.rotation")
rotate.duration = 1.5
rotate.fromValue = 0
rotate.toValue = 2 * M_PI
rotate.repeatCount = HUGE
rotate.speed = 1
loadingView.layer.add(rotate, forKey: nil)
//loadingView.layer.anchorPoint = CGPoint(x: 0, y: 0)
}
// MARK: - 復雜的加載提示
func complexLoadingIndicator() {
anotherOvalShapeLayer.strokeColor = UIColor.white.cgColor
anotherOvalShapeLayer.fillColor = UIColor.clear.cgColor
anotherOvalShapeLayer.lineWidth = 3
let anotherOvalRadius = complexLoadingView.frame.size.height/2 * 0.8
anotherOvalShapeLayer.path = UIBezierPath(ovalIn: CGRect(x: complexLoadingView.frame.size.width/2 - anotherOvalRadius, y: complexLoadingView.frame.size.height/2 - anotherOvalRadius, width: anotherOvalRadius * 2, height: anotherOvalRadius * 2)).cgPath
anotherOvalShapeLayer.lineCap = kCALineCapRound
complexLoadingView.layer.addSublayer(anotherOvalShapeLayer)
}
func complexAnimations() {
let strokeStartAnimate = CABasicAnimation(keyPath: "strokeStart")
strokeStartAnimate.fromValue = -0.5
strokeStartAnimate.toValue = 1
let strokeEndAnimate = CABasicAnimation(keyPath: "strokeEnd")
strokeEndAnimate.fromValue = 0.0
strokeEndAnimate.toValue = 1
let strokeAnimateGroup = CAAnimationGroup()
strokeAnimateGroup.duration = 1.5
strokeAnimateGroup.repeatCount = HUGE
strokeAnimateGroup.animations = [strokeStartAnimate, strokeEndAnimate]
anotherOvalShapeLayer.add(strokeAnimateGroup, forKey: nil)
}
CAReplicatorLayer
/*CAReplicatorLayer是一個新面孔,它也是CALayer的子類,正如它的名稱一樣赵讯,CAReplicatorLayer可以對它自己的子Layer進行復制操作盈咳。
*/
// MARK: - 正在播放音樂或廣播動畫
func firstReplicatorAnimation() {
let replicatorLayer = CAReplicatorLayer()
replicatorLayer.bounds = CGRect(x: replicatorAnimationView.frame.origin.x, y: replicatorAnimationView.frame.origin.y, width: replicatorAnimationView.frame.size.width, height: replicatorAnimationView.frame.size.height)
replicatorLayer.anchorPoint = CGPoint(x: 0, y: 0)
replicatorLayer.backgroundColor = UIColor.clear.cgColor
replicatorLayer.instanceCount = 3 // 設置三份
replicatorLayer.instanceTransform = CATransform3DMakeTranslation(40, 0, 0) // 設置間隔
replicatorLayer.instanceDelay = 0.3
replicatorLayer.masksToBounds = true
replicatorAnimationView.layer.addSublayer(replicatorLayer)
let rectangle = CALayer()
rectangle.bounds = CGRect(x: 0, y: 0, width: 30, height: 90)
rectangle.anchorPoint = CGPoint(x: 0, y: 0)
rectangle.position = CGPoint(x: replicatorAnimationView.frame.origin.x + 10, y: replicatorAnimationView.frame.origin.y + 110)
rectangle.cornerRadius = 2
rectangle.backgroundColor = UIColor.white.cgColor
replicatorLayer.addSublayer(rectangle)
let moveRectangle = CABasicAnimation(keyPath: "position.y")
moveRectangle.toValue = rectangle.position.y - 70
moveRectangle.duration = 0.7
moveRectangle.autoreverses = true
moveRectangle.repeatCount = HUGE
rectangle.add(moveRectangle, forKey: nil)
}
func activityIndicatorAnimation() {
let replicatorLayer = CAReplicatorLayer()
replicatorLayer.bounds = CGRect(x: 0, y: 0, width: activityIndicatorView.frame.size.width, height: activityIndicatorView.frame.size.height)
replicatorLayer.position = CGPoint(x: activityIndicatorView.frame.size.width/2, y: activityIndicatorView.frame.size.height/2)
replicatorLayer.backgroundColor = UIColor.clear.cgColor
replicatorLayer.instanceCount = 15
let angle = CGFloat(2 * M_PI) / CGFloat(15)
replicatorLayer.instanceTransform = CATransform3DMakeRotation(angle, 0, 0, 1)
replicatorLayer.instanceDelay = 1/15
activityIndicatorView.layer.addSublayer(replicatorLayer)
let circle = CALayer()
circle.bounds = CGRect(x: 0, y: 0, width: 15, height: 15)
circle.position = CGPoint(x: activityIndicatorView.frame.size.width/2, y: activityIndicatorView.frame.size.height/2 - 55)
circle.cornerRadius = 7.5
circle.backgroundColor = UIColor.white.cgColor
circle.transform = CATransform3DMakeScale(0.01, 0.01, 0.01)
replicatorLayer.addSublayer(circle)
let scale = CABasicAnimation(keyPath: "transform.scale")
scale.fromValue = 1
scale.toValue = 0.1
scale.duration = 1
scale.repeatCount = HUGE
circle.add(scale, forKey: nil)
}