Core Animation核心動畫簡介

目錄
1. Core Animation 核心動畫簡介
2. CABasicAnimation
3. CAKeyframeAnimation
4. CAAnimaitonGroup
5. CATransition
6. CAMediaTiming
7. 參考鏈接

<h1 id="1">1. Core Animation 核心動畫簡介</h1>

Core Animation，中文翻譯為核心動畫，它是一組非常強大的動畫處理API，使用它能做出非常炫麗的動畫效果，而且往往是事半功倍。也就是說，使用少量的代碼就可以實現(xiàn)非常強大的功能。

Core Animation 是跨平臺的，可以用在Mac OS X 和iOS 平臺。

Core Animation 的動畫執(zhí)行過程都是在后臺操作的，不會阻塞主線程。不阻塞主線程，可以理解為在執(zhí)行動畫的時候還能點擊（按鈕）。

要注意的是，Core Animation 是直接作用在 CALayer 上的，并非UIView，iOS 的 UIView 背后都有一個對應的 CALayer。對 UIView 的修改實際上都是對背后 CALayer 的修改。

即 Core Animation 不改變 UIView 的 Frame 屬性，也就是說并不改變 UIView 的實際位置。

為了更好的理解Core Animation，首先了解一下UIView與CALayer的關系:

一個 Layer 的 frame 是由它的 anchorPoint, position, bounds, 和 transform 共同決定的，而一個 UIView 的 frame 只是簡單的返回 CALayer 的 frame，同樣 View 的 center和 bounds 也是返回 CALayer 的一些屬性。當 CALayer 在背后支持一個 UIView 的時候，UIView 就是它的 delegate。即，UIView 是 CALayer 的CALayerDelegate。

總結UIView和CALayer的區(qū)別與聯(lián)系：

  • 1. 首先UIView可以響應事件，Layer不可以.
  • 2. UIView主要是對顯示內(nèi)容的管理而 CALayer 主要側(cè)重顯示內(nèi)容的繪制。
  • **3.在做 iOS 動畫的時候，修改非 RootLayer的屬性（譬如位置、背景色等）會默認產(chǎn)生隱式動畫，而修改UIView則不會。 **

坐標 信息是 UIView 的一個屬性（實際是對應到 CALayer 的屬性），在動畫實現(xiàn)里，我們只需要指定起始和結束的兩個關鍵值就夠了，中間的過渡值都有系統(tǒng)自動生成。這里出現(xiàn)了兩種值，一個是我們設定的，一個是系統(tǒng)生成的，所以要先在這里插入一個 模型層 和 展現(xiàn)層 的概念了。

CALayer 的同一個屬性值，會分別保存在模型層 modelLayer ，和展現(xiàn)層 presentationLayer 中。當我們修改屬性值時，是修改的模型層的數(shù)值，動畫時系統(tǒng)根據(jù)模型層的變化，生成的過渡值，是保存在展現(xiàn)層中的。
在CALayer 的對象里能直接訪問到這兩層的信息。而CALayer 的底層實現(xiàn)實際不止這兩層，但我們現(xiàn)在討論動畫的時候，可以只關心這兩層。

在整個動畫過程中，呈現(xiàn)出來的過程是這樣的：

  1. 動畫前，顯示模型層的當前值；
  2. 動畫開始，切換顯示展現(xiàn)層的值；
  3. 動畫過程中，展現(xiàn)層的值根據(jù)時間變化，我們看到的實際是展現(xiàn)層的值在變化；
  4. 動畫結束，切換回顯示模型層的值，此時模型層的值應被修改為動畫結束時的值。

由于在動畫過程中，修改的只是展現(xiàn)層的值，模型層的值并沒有改變，所以Core Animation 并不修改 UIView 的實際位置。（如果要修改UIView 的實際位置，則要手動修改 UIView 的 Frame）

搞清楚UIView和CALayer的關系后，我們開始正式介紹Core Animation。

CAAnimation類的繼承結構圖

CAAnimation ( Core Animation ) 是所有動畫類的父類，不能直接使用，應該使用它的子類。
CAAnimation 包括三個子類：CAAnimationGroup、CAPropertyAnimation、CATransition。其中，CAPropertyAnimation 也不能直接使用，想要創(chuàng)建動畫對象，應該使用它的兩個子類：CABasicAnimation 和 CAKeyframeAnimation。

  • CABasicAnimation，可設定起始結束兩個關鍵幀的信息。

任何動畫要表現(xiàn)出運動或者變化,至少需要兩個不同的關鍵狀態(tài),而中間的狀態(tài)的變化可以通過插值計算完成,從而形成補間動畫,表示關鍵狀態(tài)的幀叫做關鍵幀.

  • CAKeyframeAnimation，除首尾外，還可添加多個中間關鍵幀（關鍵點）。
  • CAAnimationGroup，可組合多個動畫，因為上面兩種動畫一次只能設置一個屬性值。
  • CATransition，圖層過渡動畫，默認是淡入。比如修改一個 CALayer的背景色時，是從初始色慢慢淡入過渡到結束色。可修改為新顏色把舊顏色頂出去等效果。還可使用 CIFilter 濾鏡做過渡效果，一些開源 UIViewController 的過渡動畫使用了這種方式。

CAAnimation注意要點：

  • 1. 能用的動畫類只有4個子類：CABasicAnimation、CAKeyframeAnimation、CATransition、CAAnimationGroup
  • 2. CAMediaTiming是一個協(xié)議（protocol）
  • 3. 屬性解析：
    CAMediaTiming媒體時間類協(xié)議:
 1.beginTime 動畫開始的時間 默認為0
 2.duration  動畫的持續(xù)時間 默認為0 持續(xù)時間 受速度的影響 實際動畫完成時間 = 持續(xù)時間/速度
 3.speed  動畫的播放速度 默認為1 速度設置為0 可以暫停動畫
   如果speed 2  duration 60 那么動畫真正播放完成的時間 30秒
 4.timeOffset 動畫播放時間的偏移量
 5.repeatCount 動畫的循環(huán)次數(shù) 默認是0 只播放一次
 6.repeatDuration 動畫循環(huán)的持續(xù)時間
 repeatCount/repeatDuration 只能設置其中的一個屬性
 7.autoreverses 是否以動畫的形式返回 返回到播放之前的狀態(tài)
 8.fillMode 設置當前對象在非活動時間段的狀態(tài)
 要想fillMode有效 需設置removedOnCompletion = NO
 kCAFillModeForwards 當動畫結束后，layer會一直保持著動畫最后的狀態(tài)
 kCAFillModeBackwards 立即進入動畫的初始狀態(tài)并等待動畫開始
 kCAFillModeBoth 動畫加入后開始之前 layer處于動畫初始狀態(tài) 動畫結束后layer保持動畫最后的狀態(tài)
 kCAFillModeRemoved 默認值 動畫結束后 layer會恢復到之前的狀態(tài)

CAAnimation動畫屬性方法介紹：

  1.初始化的方法 animation
  2.timingFunction 速度控制類 控制動畫運行的節(jié)奏
  timingFunction的初始化方法: functionWithName:
  kCAMediaTimingFunctionLinear        線性,勻速
  kCAMediaTimingFunctionEaseIn        慢進后快
  kCAMediaTimingFunctionEaseOut       快進后慢
  kCAMediaTimingFunctionEaseInEaseOut 先慢進后快再慢出 
  kCAMediaTimingFunctionDefault       實際效果是動畫中間比較快
  3.delegate 代理
  4.removedOnCompletion 完成動畫的時候 是否移除動畫效果 默認為YES
  5.代理方法
  - (void)animationDidStart:(CAAnimation *)anim
  - (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag

下圖展示了前面四種 Timing Function 的曲線圖，橫坐標表示時間，縱坐標表示變化量，斜率代表速度。

timingFunction參數(shù)圖解（曲線斜率表示動畫速率）

kCAMediaTimingFunctionLinear 選項創(chuàng)建了一個線性的計時函數(shù)，同樣也是 CAAnimation 的 timingFunction 屬性為空時候的默認函數(shù)。
線性步調(diào)對于那些立即加速并且保持勻速到達終點的場景會有意義（例如射出槍膛的子彈），但是對大多數(shù)的動畫來說確實很少用到。

kCAMediaTimingFunctionEaseIn 常量創(chuàng)建了一個慢慢加速然后突然停止的方法。
對于自由落體的例子來說很適合，或者比如對準一個目標的導彈的發(fā)射。

kCAMediaTimingFunctionEaseOut 則恰恰相反，它以一個全速開始，然后慢慢減速停止。
它有一個削弱的效果，應用的場景比如一扇門慢慢地關上，而不是砰地一聲。

kCAMediaTimingFunctionEaseInEaseOut 創(chuàng)建了一個慢慢加速然后再慢慢減速的過程。這是現(xiàn)實世界大多數(shù)物體移動的方式，也是大多數(shù)動畫來說最好的選擇。
如果只可以用一種緩沖函數(shù)的話，那就必須是它了。那么你會疑惑為什么這不是默認的選擇，實際上當使用UIView的動畫方法時，他的確是默認的，但當創(chuàng)建CAAnimation的時候，就需要手動設置它了。

kCAMediaTimingFunctionDefault，它和kCAMediaTimingFunctionEaseInEaseOut 很類似，但是加速和減速的過程都稍微有些慢。
它和 kCAMediaTimingFunctionEaseInEaseOut 的區(qū)別很難察覺，可能是蘋果覺得它對于隱式動畫來說更適合（然后對UIKit就改變了想法，而是使用 kCAMediaTimingFunctionEaseInEaseOut 作為默認效果），
雖然它的名字說是默認的，但還是要記住當創(chuàng)建顯式動畫的 CAAnimation， 它并不是默認選項（顯示動畫使用kCAMediaTimingFunctionLinear作為默認效果）。
  • 4. Core Animation 不改變 UIView 的 Frame 屬性，也就是說并不改變 UIView 的實際位置。(再次強調(diào))

<h1 id = "2">2. CABasicAnimation</h1>
CABasicAnimation 是用于兩個關鍵幀（兩種狀態(tài)）之間的動畫。通過設置起始和結束兩個關鍵幀信息，系統(tǒng)自動生成過渡動畫。（可以直接設置結束關鍵幀，則以UIView當前位置為默認起始關鍵幀**）

屬性說明：

  1. **keyPath **動畫類型：
    a. 平移動畫: position/transform.translation.x
    b. 旋轉(zhuǎn)動畫 : transform.rotation/transform.rotation.x /transform.rotation/rotation.y
    c. 縮放動 畫:bounds/transform.scale/transform.scale.x/transform.scale.y
  1. fromValue 動畫開始位置
  2. **toValue **動畫結束位置
  3. **byValue **動畫增加值
  4. **removedOnCompletion **動畫完成后不要刪除
  5. **fillMode **保持最新狀態(tài)

<h1 id = "3">3. CAKeyframeAnimation</h1>
**CAKeyframeAnimation **是 CABasicAnimation 的升級版，區(qū)別在于可以用于多個關鍵幀（多個狀態(tài)，多個關鍵點）。
屬性說明：

  1. **keyPath **動畫類型：
    a. 平移動畫: position/transform.translation.x
    b. 旋轉(zhuǎn)動畫 : transform.rotation/transform.rotation.x /transform.rotation/rotation.y
    c. 縮放動 畫:bounds/transform.scale/transform.scale.x/transform.scale.y
  1. **fromValue **動畫開始位置
  2. **toValue **動畫結束位置
  3. **byValue **動畫增加值
  4. **removedOnCompletion **動畫完成后不要刪除
  5. **fillMode **保持最新狀態(tài)

與 CABasicIAnimation 相比 CAKeyframeAnimation 增加幾個屬性：

  1. path：運動的曲線。

path 是一個 **CGPathRef **的值,且 **path **只能對 **CALayer **的 **anchorPoint **和 position 屬性起作用,且設置了 path 之 后 **values **就不再起效了

  1. values: 是一個NSArray對象。里面的元素稱為『關鍵幀』(Keyframe)。動畫對象會在指定的時間（duration）內(nèi)，依次移動到values數(shù)組中的每一個關鍵幀。（values 和 path 是互斥的： 如果設置了 path，values 是被忽略的）
  2. keyTimes: 為對應的關鍵幀指定的時間點，該屬性是一個數(shù)組（數(shù)組內(nèi)容為的 NSNumber 對象），keyTimes中的每一個時間值都對應values中的每一幀，可以為每個關鍵幀（子路徑AB，BC，CD，DE）指定對應的時間點。例如，你可以傳入@[@(0.0), @(0.1), @(0.6), @(0.7), 1.0]，其中首尾必須分別是0和1。因此，t(AB) = 0.1 - 0, t(BC) = 0.6 - 0.1, t(CD) = 0.7 - 0.6, t(DE) = 1 - 0.7。當keyTimes沒有設置的時候，各個關鍵幀的時間是平分。
  • ** timeFunctions：存儲timeFunciton類型的數(shù)組，用于控制每段動畫的運動節(jié)奏。(需要注意的是：若keyTimes未設置（各幀時間平分），timesFunctions選擇勻速，此時意味著每一段動畫都是勻速，而非意味著每一段動畫的速度都是相同的。因為速度還取決與距離：時間相同、動畫確定是勻速運動，但是距離不同，所以是勻速但速度不同！)
  • calculationMode ：主要針對的是每一幀的內(nèi)容為一個坐標點的情況，也就是對anchorPoint 和 **position **進行的動畫。當在平面座標系中有多個離散的點的時候，可以是離散的，也可以直線相連后進行插值計算，也可以使用圓滑的曲線將他們相連后進行插值計算。
    calculationMode目前提供如下五種模式：

kCAAnimationLinear calculationMode的默認值,表示當關鍵幀為坐標點的時候，關鍵幀之間直接直線相連進行插值計算;
**kCAAnimationDiscrete **表示離散，就是不進行插值計算，所有關鍵幀直接逐個進行顯示;

kCAAnimationPaced 使得動畫均勻進行，而不是按keyTimes 設置的或者按關鍵幀平分時間，此時keyTimes 和timingFunctions 無效;
kCAAnimationCubic 對關鍵幀為坐標點的關鍵幀進行圓滑曲線相連后插值計算，對于曲線的形狀還可以通過tensionValues， continuityValues，biasValues 來進行自定義調(diào)整，這里的數(shù)學原理是Kochanek–Bartels spline，這里的主要目的是使得運行的軌跡變得圓滑;

<h1 id = "4">4. CAAnimaitonGroup </h1>
**CAAnimaitonGroup 可以組合多個動畫，因為上面兩種動畫一次只能設置一個屬性值。使用CAAnimaitonGroup **，一個CALayer設定了很多動畫，他們都會同時按順序執(zhí)行。
屬性說明：

animations：是一個NSArray對象，用于保存CAKeyframeAnimation和CABasicAnimation對象。實現(xiàn)多種動畫效果同時進行。

<h1 id = "5">5. CATransition </h1>
CATransition ** 實際上是蘋果幫開發(fā)者封裝好的一些動畫，專門用于做轉(zhuǎn)場動畫。（能夠為層和視圖控制器提供移出屏幕和移入屏幕的動畫效果）。UINavigationController就是通過CATransition**實現(xiàn)了將控制器的視圖推入屏幕的動畫效果。
屬性說明：

type：動畫過渡效果類型
subtype：動畫過渡方向
startProgress：動畫起點(在整體動畫的百分比，必須小于等于結束點)
endProgress：動畫終點(在整體動畫的百分比，必須大于等于開始點)

**type **（轉(zhuǎn)場動畫的類型）的參數(shù)：

|動畫類型 |說明 |對應常量 |是否支持方向設置 |
| :-------: | :--: | :--------: | :----------------: |
|公開API：|
| fade | 淡出效果 | kCATransitionFade | 是 |
| movein | 新視圖移動到舊視圖上 | kCATransitionMoveIn | 是 |
| push | 新視圖推出舊視圖 | kCATransitionPush | 是 |
| reveal | 移開舊視圖顯示新視圖 | kCATransitionReveal | 是 |
|私有API： |
|私有API只能通過字符串訪問，如@"cube"|
| cube | 立方體翻轉(zhuǎn)效果 |無 | 是 |
| oglFlip | 翻轉(zhuǎn)效果 |無 | 是 |
| suckEffect | 收縮效果 |無 | 否 |
| rippleEffect | 水滴波紋效果|無 | 否 |
| pageCurl | 向上翻頁效果 |無 | 是 |
| pageUnCurl | 向下翻頁效果|無 | 是 |
| cameralIrisHollowOpen | 攝像頭打開效果|無 | 否 |
| cameraIrisHollowClose | 攝像頭關閉效果|無 | 否 |

subtype（動畫過渡方向）的參數(shù)

  • kCATransitionFromRight：從右側(cè)轉(zhuǎn)場
  • kCATransitionFromLeft：從左側(cè)轉(zhuǎn)場
  • kCATransitionFromTop：從頂部轉(zhuǎn)場
  • kCATransitionFromBottom： 從底部轉(zhuǎn)場

<h1 id = "6">6. CAMediaTiming</h1>
CAMediaTiming是CAAnimation遵守的協(xié)議（protocol）定義了一系列的屬性。

  1. beginTime 動畫開始的時間 默認為0
  1. duration 動畫的持續(xù)時間 默認為0 持續(xù)時間 受速度的影響 實際動畫完成時間 = 持續(xù)時間/速度
  2. speed 動畫的播放速度 默認為1 速度設置為0 可以暫停動畫。 如果speed = 2 duration = 60 那么動畫真正播放完成的時間 30秒
  3. timeOffset 動畫播放時間的偏移量
  4. repeatCount 動畫的循環(huán)次數(shù) 默認是0 只播放一次
  5. repeatDuration 動畫循環(huán)的持續(xù)時間
    repeatCount/repeatDuration 只能設置其中的一個屬性
  6. autoreverses 是否以動畫的形式返回 返回到播放之前的狀態(tài)
  7. fillMode 設置當前對象在非活動時間段的狀態(tài)，要想fillMode有效 需設置removedOnCompletion = NO

kCAFillModeForwards 當動畫結束后，layer會一直保持著動畫最后的狀態(tài)
kCAFillModeBackwards 立即進入動畫的初始狀態(tài)并等待動畫開始
kCAFillModeBoth 動畫加入后開始之前 layer處于動畫初始狀態(tài) 動畫結束后layer保持動畫最后的狀態(tài)
kCAFillModeRemoved 默認值 動畫結束后 layer會恢復到之前的狀態(tài)

<h5 id = "7">參考鏈接 </h5>

最后編輯于 ：
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容