一切蟋、CoreAnimation 結(jié)構(gòu)
上圖就是CoreAnimation 的結(jié)構(gòu)圖,
1湾蔓、CAAnimtaionGroup,CApropertyAnimation ,CATransition 繼承于CAAniamtion
2侍瑟、CABasicAnimation ,CAKeyframeAnimation 繼承于CAPropertyAnimation
二、本文主要介紹一下CABasicAnimation(基礎(chǔ)動(dòng)畫),CAKeyframeAnimation (關(guān)鍵幀動(dòng)畫),CAAnimtaionGroup(組動(dòng)畫),還有CATransition(轉(zhuǎn)場(chǎng)動(dòng)畫),這幾個(gè)也是經(jīng)常使用的動(dòng)畫
1、 基礎(chǔ)動(dòng)畫CABasicAnimation
let animation = CABasicAnimation.init(keyPath: "position")
animation.fromValue = NSValue.init(cgPoint: CGPoint(x: 50, y: KH/2 - 75))
animation.toValue = NSValue.init(cgPoint: CGPoint(x:KW - 50, y: KH/2 - 75))
animation.duration = 1
self.squrView.layer.add(animation, forKey: "positionAnimation")
1)keyPath 可以是 ,position(位置)、 opacity (透明度) 铸鹰、transform.scale(比例) 、transform.rotation.z(旋轉(zhuǎn))皂岔、backgroundColor(背景顏色) 等
2)fillMode 動(dòng)畫結(jié)束后的狀態(tài)類型
kCAFillModeRemoved(動(dòng)畫結(jié)束后蹋笼,layer會(huì)恢復(fù)到之前的狀態(tài))
kCAFillModeForwards (當(dāng)動(dòng)畫結(jié)束后,layer會(huì)一直保持著動(dòng)畫最后的狀態(tài))
kCAFillModeBackwards (當(dāng)在動(dòng)畫開(kāi)始前,你只要把layer加入到一個(gè)動(dòng)畫中,layer便立即進(jìn)入動(dòng)畫的初始狀態(tài)并等待動(dòng)畫開(kāi)始)
kCAFillModeBoth (這個(gè)其實(shí)就是上面兩個(gè)的合成.動(dòng)畫加入后開(kāi)始之前躁垛,layer便處于動(dòng)畫初始狀態(tài)剖毯,動(dòng)畫結(jié)束后layer保持動(dòng)畫最后的狀態(tài))
3)removedOnCompletion 結(jié)束后是否移除
2、幀動(dòng)畫CAKeyframeAnimation
幀動(dòng)畫是CABasicAnimation 動(dòng)畫的擴(kuò)展,
1)基礎(chǔ)動(dòng)畫只有fromValue,toView,而幀動(dòng)畫有一個(gè)values數(shù)組,里面的元素稱為“關(guān)鍵幀”(keyframe)教馆。動(dòng)畫對(duì)象會(huì)在指定的時(shí)間(duration)內(nèi)逊谋,依次顯示values數(shù)組中的每一個(gè)關(guān)鍵幀
2)path屬性:讓涂層按照路徑軌跡移動(dòng).
let keyFrameAnimation = CAKeyframeAnimation.init(keyPath: "position")
let value = NSValue.init(cgPoint: CGPoint.init(x: 50, y: KH/2 - 50 ))
let value1 = NSValue.init(cgPoint: CGPoint.init(x: KW/3, y: KH/2 - 50 ))
let value2 = NSValue.init(cgPoint: CGPoint.init(x: KW/3, y: KH/2 + 50))
let value3 = NSValue.init(cgPoint: CGPoint.init(x: KW*2/3, y: KH/2 + 50 ))
let value4 = NSValue.init(cgPoint: CGPoint.init(x: KW*2/3, y: KH/2 - 50))
let value5 = NSValue.init(cgPoint: CGPoint.init(x: KW - 50, y: KH/2 - 50 ))
keyFrameAnimation.values = [value,value1,value2,value3,value4,value5]
keyFrameAnimation.duration = 1
self.squrView.layer.add(keyFrameAnimation, forKey: keyFrameAnimation.keyPath)
3、動(dòng)畫組CAAnimtaionGroup
1)動(dòng)畫組可以把基礎(chǔ)動(dòng)畫和關(guān)鍵幀動(dòng)畫結(jié)合起來(lái)
2)屬性說(shuō)明:animations:用來(lái)保存一組動(dòng)畫對(duì)象的NSArray
3)組動(dòng)畫可以同時(shí)進(jìn)行,也可以連續(xù)進(jìn)行,可以修改 beginTime 達(dá)到效果
let keyFrameAnimation = CAKeyframeAnimation.init(keyPath: "position")
let value = NSValue.init(cgPoint: CGPoint.init(x: 50, y: KH/2 - 50 ))
let value1 = NSValue.init(cgPoint: CGPoint.init(x: KW/3, y: KH/2 - 50 ))
let value2 = NSValue.init(cgPoint: CGPoint.init(x: KW/3, y: KH/2 + 50))
let value3 = NSValue.init(cgPoint: CGPoint.init(x: KW*2/3, y: KH/2 + 50 ))
let value4 = NSValue.init(cgPoint: CGPoint.init(x: KW*2/3, y: KH/2 - 50))
let value5 = NSValue.init(cgPoint: CGPoint.init(x: KW - 50, y: KH/2 - 50 ))
keyFrameAnimation.values = [value,value1,value2,value3,value4,value5]
let scaleAnimation = CABasicAnimation.init(keyPath: "transform.scale")
scaleAnimation.fromValue = 0.8
scaleAnimation.toValue = 2
let rotationAnimation = CABasicAnimation.init(keyPath: "transform.rotation.z")
rotationAnimation.toValue = Double.pi*4
let groupAni = CAAnimationGroup.init()
groupAni.animations = [keyFrameAnimation,scaleAnimation,rotationAnimation]
groupAni.duration = 4
self.squrView.layer.add(groupAni, forKey: "groupAnimation")
4活玲、轉(zhuǎn)場(chǎng)動(dòng)畫CATransition
let animation = CATransition.init()
animation.type = .fade
animation.duration = 1
self.squrView.layer.add(animation, forKey: "fadeAnimation")
屬性說(shuō)明:
type:動(dòng)畫過(guò)度類型
subtype:動(dòng)畫過(guò)渡方向