CATransition 過場動畫

  

CATransition 和 CABasicAnimation，同樣都是繼承於 CAAnimation 類別的一個物件，有別於 CABasicAnimation 繁瑣的動畫設定，CATransition 提供一種簡單容易使用的方式來製作過場動畫，由於少了複雜的設定，在動畫的種類上我們並沒有太多的選擇，下面就是 CATransition 過場動畫的使用方式。另外，有關 CABasicAnimation 的相關資訊，請前往本站的索引式搜索頁面中，輸入「CABasicAnimation」字串作查詢。

由於使用 CATransition 需要用到 UIView 中的 Layer 物件，所以必須要先對專案新增 QuartzCore.framework，並且引用對應的標頭檔。

以手動的方式替專案新增 QuartzCore.framework

#import < QuartzCore/QuartzCore.h>


對於新增 Framework 有問題的讀者們，請參考 Xcode 4 新增 Framework 的方法一文。

基本設定

關於 CATransition 過場動畫的設定，大家可以參考以下程式碼來實作。

//宣告一個CATransition
CATransition *transition = [CATransition animation];

//細部設定
[transition setDelegate:self];
[transition setDuration:1.0f];

//動畫內容
[transition setType:kCATransitionFade];
[transition setSubtype:kCATransitionFromRight];

//執行動畫
[[imageView layer] addAnimation:transition forKey:@"myTransition"];

在上述程式碼中，我們將此過場動畫 myTransition 套用在 imageView 上，並且持續 1  秒，動畫的內容為由右往左的 kCATransitionFade 效果。

在動畫內容的部份是由 setType 和 setSubtype 兩個設定參數來做決定，setType 決定了動畫的效果，像是翻頁、水波紋或是旋轉等，而 setSubtype 決定的是動畫的方向，你可以參考 CAAnimation.h 取得其他的設定參數。

//CAAnimation.h
/* Common transition types. */

CA_EXTERN NSString * const kCATransitionFade
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);
CA_EXTERN NSString * const kCATransitionMoveIn
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);
CA_EXTERN NSString * const kCATransitionPush
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);
CA_EXTERN NSString * const kCATransitionReveal
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);

/* Common transition subtypes. */

CA_EXTERN NSString * const kCATransitionFromRight
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);
CA_EXTERN NSString * const kCATransitionFromLeft
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);
CA_EXTERN NSString * const kCATransitionFromTop
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);
CA_EXTERN NSString * const kCATransitionFromBottom
__OSX_AVAILABLE_STARTING (__MAC_10_5, __IPHONE_2_0);

另外，除了上述 CAAnimation.h 中所定義的 4 種動畫效果外，還有一些其他特殊的動畫效果，你可以透過字串的方式輸入這些效果的名稱來產生動畫特效。

@" "             //漸隱(default)
@"suckEffect"    //刪除(MAC上視窗縮小至Dock的效果)
@"pageCurl"      //向上翻頁
@"pageUnCurl"    //向下翻頁
@"rippleEffect"  //水波紋
@"cube"          //立方體
@"oglFlip"       //翻轉
@"push"          //推移

ps:當輸入的效果字串錯誤時，就會以預設的漸隱效果來呈現，但是當輸入 「@""」 而非 「@" "」 時並不會產生任何動畫效果。

動畫開始和結束時的處理

在細部設定中，我們可以透過 setDelegate 方法來設定「實作動畫開始或是結束時的處理動作」的地方，在上述的步驟裡我們已經將實作的地方設定為自己本身的 Class，所以接下來只要實作以下兩個內建的方法函式即可。

//動畫開始時所觸發的內建方法函式
- (void)animationDidStart:(CAAnimation *)anim {
    [imageView setHidden:YES];
}

//動畫結束時所觸發的內建方法函式
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
    if (flag) {
        [imageView setHidden:NO];
    }
}

上述程式碼中，當動畫開始時我們會將 imageView 隱藏起來，以免畫面上同時出現兩個一樣的影像，而當動畫結束時才重新顯示隱藏的 imageView。

暫停與恢復動畫

過場動畫通常非常的短暫，但是還是有可能會需要使用到暫停與恢復的機制，透過仿造 CABasicAnimation 的暫停與恢復一文的方法，取得 CATransition 的執行時間，與設定 CATransition 過場動畫的開始位置，也可以實作出暫停與恢復動畫的機制（以下是部分的關鍵程式碼）。

//取得執行速度並停止動畫
float speed = [transition speed];
[transition setSpeed:0.0];
//取得動畫執行到現在所花費的時間
CFTimeInterval pausedTime = [transition timeOffset];
//設定動畫開始的位置
[transition setStartProgress:pausedTime];

其他的細部設定

當然 CATransition 的能做的設定不只上述這幾種，在 CATransition 中還包含著許多的細部設定，像是 setRepeatCount 設定動畫的重複次數，或是 setRemovedOnCompletion 在完成動畫之後即刪除該動畫的所有設定等，就不逐一介紹，如果大家有興趣可以親自嘗試看看。