首先搭建一個工程,可以進行學習,要求有:
1.在storyboard中的ViewController上放置2個Button,1個view(顏色為橘紅色)
2.將ViewController中的Button以及View與ViewController.swift關聯(lián),用ctl拖動方法,Button選擇action(命名為startAnimationButton和goBackAnimationButton),view選擇outlet(命名為viewOfAnimation)。
3.在ViewController.swift寫入一些基本代碼:
OK啦,基本要素搭建完畢,下面就開始學習iOS的動畫編程啦
一、視圖動畫:UIViewAnimation
1.UIView.animateWithDuration方法介紹
調用動畫的代碼:UIView.animateWithDuration
我們先來了解其中一個代碼
UIView.animateWithDuration(duration: NSTimeInterval, animations: () -> Void() -> Void)
第一個要素是動畫持續(xù)時間,例如一秒就寫入1
第二個要素是block,回車就可以展開block
例如將一個view向右移動100這個動畫可以用如下圖代碼實現(xiàn):
2.UIViewAnimateOptions方法介紹
調用方法見下圖中第三個選項:
UIViewAnimateOptions主要控制以下3類事情:
(1)動畫控制相關
LayoutSubviews
提交動畫的時候布局子控件,子控件將和父控件一起動畫
AllowUserInteraction
動畫在執(zhí)行時運行用戶交互,比如用戶可以觸摸屏幕
BeginFromCurrentState
所有的界面從當前的值開始動畫,而不是從初始值開始動畫
Repeat
動畫無限次重復
Autoreverse
如果設置了動畫無限次重復,執(zhí)行動畫回路
OverrideInheritedDuration
忽略外層動畫持續(xù)時間
OverrideInheritedCurve
忽略外側動畫的時間變化曲線
AllowAnimatedContent
允許改變動畫內容嗎,只能在transition的時候使用
ShowHideTransitionViews
顯示或者隱藏,不使用增加或者移除
OverrideInheritedOptions
不繼承任何選項或者動畫類型
(2)時間曲線相關
執(zhí)行動畫的時候,動畫的速度的變化
CurveEaseInOut
由慢到快再到慢CurveEaseIn
由慢到快CurveEaseOut
由快到慢CurveLinear
勻速
(3)轉場效果相關
TransitionNone
這個是默認的,無轉場效果
TransitionFlipFromLeft
從左翻轉
TransitionFlipFromRight
從右翻轉
TransitionCurlUp
上卷
TransitionCurlDown
下卷
TransitionCrossDissolve
交叉消失
TransitionFlipFromTop
從上翻轉
TransitionFlipFromBottom
從下翻轉
3.UIViewAnimation操作視圖屬性方法
(1)Block
蘋果建議使用此方法。此方法適用于iOS6.0以及以后的版本
(2)Begin/Commit
iOS6.0以前使用此方法。
(3)Nest
動畫中可以嵌套子動畫,使用OverrideInheritedDuration
、OverrideInheritedCurve
和OverrideInheritedOptions
重新嵌套的子動畫屬性,如果不重寫,子動畫將會繼承父動畫的屬性。
UIViewAnimationOpitions可以用
|
來同時使用多個
4.transitionWithView視圖切換的動畫效果
常見的一個列子就是閱讀APP,讀書的APP或者閱讀小說的APP,看書時打開下一頁時,會有翻書的效果,這個效果,就是使用視圖切換的動畫效果制作出來的。
代碼如下圖:
5.transitionFromView視圖替換的動畫效果
這個是一個view來替換一個view,從語法中能看出和4的區(qū)別
二、核心動畫:CoreAnimation
1.圖層CALayer
self.view.layer.addSublayer()
layer只負責圖層的顯示,沒有動作的響應。
layer的屬性有:
backgroundColor 背景顏色
borderWidth 邊框寬度
borderColor 邊框顏色
cornerRadius 邊框圓角度數(shù)(矩形四個角)
shadowColor 陰影的顏色
shadowOffset 陰影的偏移量
shadowRadius 陰影的邊框圓角度數(shù)
shadowOpacity 陰影的透明度
shadowPath 陰影的路徑
等等,還有其他的屬性,在xcode幫助文檔中輸入CALayer即可找到所有的介紹。
2.動畫類CAAnimation
(1)CABasicAnimation顯式動畫
(2)CAKeyFrameAnimation關鍵幀動畫
(3)CAAnimationGroup
(4)CATransition
position.x
3.事務類CATransaction
4.顯式動畫CABasicAnimation
1)選定演員CALayer
2)寫劇本CABasicAnimation
CABasicAnimation(keyPath:"transform.scale")
CABasicAnimation(keyPath:"opacity")
fromValue
toValue
autoreverses
repeatCount (MAXFLOAT)
duration
3)將劇本給演員addAnimation
layer.addAnimation
具體代碼如下:
5.關鍵幀動畫CAKeyFrameAnimation
1)選定演員CALayer
2)寫劇本CAKeyFrameAnimation
CAKeyFrameAnimation(keyPath:"position")
確定四個位置的值:
位置一原點:NSValue(CGPoint: layer.position)
value值確定輸入四個位置點
autoreverses
repeatCount
duration
3)將劇本給演員addAnimation
具體代碼如下:
6.CAMediatimingFunctions功能介紹
可以改變關鍵幀動畫中的運行軌跡和動畫表格
具體見代碼:
keyTimes
是每一段執(zhí)行的時間