iOS開發——動畫編程OC篇&（一）基本動畫

標籤：

基本動畫

一、簡單介紹

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

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

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

要注意的是，Core Animation是直接作用在CALayer上的，並非UIView。

 

二、Core Animation的使用步驟

1.使用它需要先添加QuartzCore.framework架構和引入主標頭檔<QuartzCore/QuartzCore.h>(iOS7不需要)

2.初始化一個CAAnimation對象，並設定一些動畫相關屬性

3.通過調用CALayer的addAnimation:forKey:方法增加CAAnimation對象到CALayer中，這樣就能開始執行動畫了

4.通過調用CALayer的removeAnimationForKey:方法可以停止CALayer中的動畫

 

三、CAAnimation

類的繼承結構圖

　　

CAAnimation是所有動畫類的父類，但是它不能直接使用，應該使用它的子類。

 常見屬性有：

duration：動畫的期間

repeatCount：動畫的重複次數

timingFunction：控制動畫啟動並執行節奏

說明：（1）能用的動畫類只有4個子類：CABasicAnimation、CAKeyframeAnimation、CATransition、CAAnimationGroup

　　   （2）CAMediaTiming是一個協議(protocol)。

CAPropertyAnimation是CAAnimation的子類，但是不能直接使用，要想建立動畫對象，應該使用它的兩個子類：CABasicAnimation和CAKeyframeAnimation

它有個NSString類型的keyPath屬性，你可以指定CALayer的某個屬性名稱 為keyPath，並且對CALayer的這個屬性的值進行修改，達到相應的動畫效果。比如，指定@"position"為keyPath，就會修改 CALayer的position屬性的值，以達到平移的動畫效果

 

四、補充說明

所有動畫對象的父類，負責控制動畫的期間和速度，是個抽象類別，不能直接使用，應該使用它具體的子類

屬性解析：(紅色代表來自CAMediaTiming協議的屬性)

duration：動畫的期間

repeatCount：動畫的重複次數

repeatDuration：動畫的重複時間

removedOnCompletion：預設為YES，代表動畫執行完畢後就從圖層上移除，圖形會恢複到動畫執行前的狀態。如果想讓圖層保持顯示動畫執行後的狀態，那就設定為NO，不過還要設定fillMode為kCAFillModeForwards

fillMode：決定當前對象在非active時間段的行為.比如動畫開始之前,動畫結束之後

beginTime：可以用來設定動畫順延強制時間，若想延遲2s，就設定為CACurrentMediaTime()+2，CACurrentMediaTime()為圖層的目前時間

timingFunction：速度控制函數，控制動畫啟動並執行節奏

delegate：動畫代理

  1 /**  2  自訂一個視圖，監聽手勢點擊操作，在手勢觸控螢幕幕時，產生動畫效果  3    4  1. 縮放  5  2. 旋轉  6    7  判斷動畫暫停和繼續的原則：  8    9  根據該動畫是點綴動畫（粒子效果）還是具有破壞性的動畫（例如大招、飛刀、子彈等） 10   11  如果是點綴動畫，失去焦點時不需要暫停 12  如果是破壞性動畫，失去焦點時需要暫停 13   14  3. 在本樣本中，退出後台暫停動畫，回到前台，繼續動畫 15   16  基本動畫簡單小結 17  1. 通過對CALayer的可動畫屬性進行修改，實現動畫 18  2. fromValue和toValue 19  3. 動畫使用的步驟： 20     1> 執行個體化 21     2> 定義屬性 22     3> 添加到圖層 23   24  注意點： 25     1> 迴圈播放的動畫，如果需要在恢複焦點後繼續，一定將RemovedOnCompletion屬性設定為NO 26     2> 針對平移動畫，需要在動畫結束的代理方法中，調整對象的位置 27     3> 如果要做無線迴圈動畫，可以如下設定 [anim setRepeatCount:HUGE_VALF]; 28     4> 關於暫停和繼續動畫，可以參照代碼 29  */ 30  31 - (void)viewDidLoad 32 { 33     [super viewDidLoad]; 34  35     UIView *myView = [[UIView alloc]initWithFrame:CGRectMake(50, 50, 100, 100)]; 36     [myView setBackgroundColor:[UIColor redColor]]; 37     [self.view addSubview:myView]; 38      39     self.myView = myView; 40 } 41  42 #pragma mark - 觸摸方法 43 - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event 44 { 45     // 判斷myView是否已經開始旋轉，如果已經旋轉，就停止 46     CAAnimation *anim = [self.myView.layer animationForKey:@"rotationAnim"]; 47     if (anim) { 48         // 停動畫 49 //        [self.myView.layer removeAllAnimations]; 50         // 如果動畫處於暫停，就繼續，如果播放中就暫停 51         // 可以根據myView.layer.speed來判斷，speed == 0，暫停 52         if (self.myView.layer.speed == 0.0) { 53             [self resumeAnimation]; 54         } else { 55             [self pauseAnimation]; 56         } 57     } else { 58         [self rotationAnimation]; 59     } 60 } 61  62 #pragma mark - 動畫的暫停和恢複 63 #pragma mark 動畫暫停 64 - (void)pauseAnimation 65 { 66     // 1. 取出當前的動畫的時間點，就是要暫停時間點 67     CFTimeInterval pauseTime = [self.myView.layer convertTime:CACurrentMediaTime() fromLayer:nil]; 68     // 2. 設定動畫的時間位移量，指定時間位移量的目的是讓動畫定格在該時間點 69     [self.myView.layer setTimeOffset:pauseTime]; 70      71     // 3. 將動畫的運行速度設定為0，動畫預設的運行速度是1.0 72     [self.myView.layer setSpeed:0.0]; 73 } 74  75 #pragma mark 恢複動畫 76 - (void)resumeAnimation 77 { 78     // 1. 將動畫的時間位移量作為暫停時的時間點 79     CFTimeInterval pauseTime = self.myView.layer.timeOffset; 80     // 2. 根據媒體時間計算出準確的啟動動畫時間，對之前暫停動畫的時間進行修正 81     CFTimeInterval beginTime = CACurrentMediaTime() - pauseTime; 82      83     // 3. 要把位移時間清零 84     [self.myView.layer setTimeOffset:0.0]; 85     // 4. 設定圖層的開始動畫時間 86     [self.myView.layer setBeginTime:beginTime]; 87      88     [self.myView.layer setSpeed:1.0]; 89 } 90  91 #pragma mark - 動畫方法 92 #pragma mark 旋轉動畫 93 - (void)rotationAnimation 94 { 95     // 1. 執行個體化基本動畫 96     // 預設按照z軸旋轉 97     CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"]; 98      99     [self.myView.layer setAnchorPoint:CGPointMake(0, 0)];100     101     // 2. 設定動畫屬性102     // 不停的旋轉103     // 1) 旋轉一周104     [anim setToValue:@(2 * M_PI)];105     // 2) 不停的旋轉 - 動畫迴圈播放106     // HUGE_VALF 是一個非常大得浮點數，指定此數值可以認為動畫無限迴圈107     // MAXFLOAT 108     [anim setRepeatCount:HUGE_VALF];109     110     [anim setDuration:0.5f];111     112     // 3) 動畫完成時刪除113     // 對於迴圈播放的動畫效果，一定要將removedOnCompletion設定為NO，否則無法恢複動畫114     [anim setRemovedOnCompletion:NO];115     116     // 3. 添加動畫117     // key可以隨便指定，用於判斷圖層中是否存在該動畫118     [self.myView.layer addAnimation:anim forKey:@"rotationAnim"];119 }120 121 #pragma mark 縮放動畫122 - (void)scaleAnimation123 {124     // 1. 執行個體化基本動畫125     CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform.scale"];126     127     // 2. 設定動畫屬性128     // fromValue & toValue129     [anim setFromValue:@(1.0)];130     // 從當前大小縮小到一半，然後恢複初始大小131     [anim setToValue:@(0.5)];132     // 自動翻轉動畫133     [anim setAutoreverses:YES];134     135     // 動畫時間長度136     [anim setDuration:0.5f];137     138     // 3. 將動畫添加到圖層139     [self.myView.layer addAnimation:anim forKey:nil];140 }

 

  

iOS開發——動畫編程OC篇&（一）基本動畫