iOS開發總結之 CATransition

1.代碼

//

#import "ViewController.h"

@interface ViewController ()
- (IBAction)previous;
- (IBAction)next;
@property (weak, nonatomic) IBOutlet UIImageView *iconView;

/**
 *  目前圖檔的索引
 */
@property (nonatomic, assign) int index;
@end

@implementation ViewController

- (IBAction)previous{
    self.index--;
    if (self.index == -1){
        self.index = 8;
    }
    
    NSString *filename = [NSString stringWithFormat:@"%d.jpg", self.index + 1];
    self.iconView.image = [UIImage imageNamed:filename];
    
    CATransition *anim = [CATransition animation];
    anim.type = @"cube";
//    anim.subtype = kCATransitionFromLeft;
//    anim.type = @"pageUnCurl";
    anim.duration = 0.5;
    [self.view.layer addAnimation:anim forKey:nil];
}

- (IBAction)next {
    self.index++;
    if (self.index == 9) {
        self.index = 0;
    }

    NSString *filename = [NSString stringWithFormat:@"%d.jpg", self.index + 1];
    self.iconView.image = [UIImage imageNamed:filename];
    
    // 轉場動畫 兩個界面之間的過渡動畫
    CATransition *anim = [CATransition animation];
    anim.type = @"pageCurl";
    /* 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);*/
//    anim.subtype = kCATransitionFromRight; //方向
    anim.duration = 0.5;
    
//    anim.startProgress = 0.0;
//    
//    anim.endProgress = 0.5;
    
    [self.view.layer addAnimation:anim forKey:nil];
}
/*********************************************************/

 /* 過渡效果 fade     //交叉淡化過渡(不支援過渡方向) kCATransitionFade push     //新視圖把舊視圖推出去  kCATransitionPush
  moveIn   //新視圖移到舊視圖上面   kCATransitionMoveIn reveal   //将舊視圖移開,顯示下面的新視圖  kCATransitionReveal cube     //立方體翻滾效果 oglFlip  //上下左右翻轉效果 suckEffect   //收縮效果，如一塊布被抽走(不支援過渡方向) rippleEffect //滴水效果(不支援過渡方向) pageCurl     //向上翻頁效果 pageUnCurl   //向下翻頁效果 cameraIrisHollowOpen  //相機鏡頭打開效果(不支援過渡方向) cameraIrisHollowClose //相機鏡頭關上效果(不支援過渡方向)*/   /* 過渡方向 kCATransitionFromRight kCATransitionFromLeft kCATransitionFromBottom kCATransitionFromTop*/
/**
CATransition的使用
CATransition *anim = [CATransition animation];
anim.type = @“cube”; // 動畫過渡類型
anim.subtype = kCATransitionFromTop; // 動畫過渡方向
anim.duration = 1; // 動畫持續1s
// 代理，動畫執行完畢後會調用delegate的animationDidStop:finished:
anim.delegate = self;

/*******中間穿插改變layer屬性的代碼

[layer addAnimation:anim forKey:nil];
**********/
/*********************************************************/
@end
           

2.storyboard中的結構

3.效果