一、簡介
catransition是caanimation的子類，用于做轉場動畫
能夠為圖層提供移出屏幕和移入屏幕的動畫效果。ios比mac os x的轉場動畫效果少一點
如：uinavigationcontroller導航控制器就是通過catransition轉場動畫實現了將控制器的視圖推入屏幕的動畫效果
catransition頭文件
動畫屬性：
type：動畫過渡類型
subtype：動畫過渡方向
startprogress：動畫起點(在整體動畫的百分比)
endprogress：動畫終點(在整體動畫的百分比)
......
#import <quatzcore/caanimation.h>
catransition *mytransition=[catransition animation];//創建catransition
mytransition.duration=0.3;//持續時長0.3秒
mytransition.timingfunction=uiviewanimationcurveeaseinout;//計時函數，從頭到尾的流暢度
mytransition.type=kcatransionpush;//動畫類型
mytransition.subtype=kcatransitionfromleft;//子類型
//要令一個轉場生效，組要將動畫添加到將要變為動畫視圖所附著的圖層。例如在兩個視圖控制器之間進行轉場，那就將動畫添加到窗口的圖層中：
[[self.view.superview layer]addanimation:mytransition forkey:nil ];
//如果是將控制器內的子視圖轉場到另一個子視圖，就將動畫加入到視圖控制器的圖層。還有一種選擇，用視圖控制器內部的視圖作為替代，將你的子視圖作為主視圖的子圖層：
[ self.view.layer addanimation:mytransition forkey:nil ];
[ self.view addsubview:newview ];
[oldview removefromsuperview];
//如果你使用的是導航控制器，可以將動畫加到導航控制器的視圖圖層中。
[ navigationcontroller.view.layer addanimation:mytransition forkey:nil ];
轉場動畫過渡效果
二、view類自帶轉場動畫函數
1、單視圖
+(void)transitionwithview:(uiview*)view duration:(nstimeinterval)duration options:
(uiviewanimationoptions)options
animations:(void(^)(void))animations
completion:(void(^)(boolfinished))completion;
參數說明：
duration：動畫的持續時間
view：需要進行轉場動畫的視圖
options：轉場動畫的類型
animations：將改變視圖屬性的代碼放在這個block中
completion：動畫結束后，會自動調用這個block
2、雙視圖
+ (void)transitionfromview:(uiview*) fromview
toview:(uiview*) toviewduration:(nstimeinterval)durationoptions:(uiviewanimationoptions) options
completion:(void(^)(boolfinished))completion;
參數說明：
duration：動畫的持續時間
options：轉場動畫的類型
animations：將改變視圖屬性的代碼放在這個block中
completion：動畫結束后，會自動調用這個block
三、應用
注意：
轉場動畫使用注意點:轉場代碼必須和轉場動畫代碼寫在一起,否則無效
1、圖片瀏覽
實例：
代碼實現
#import "viewcontroller.h"
@interface viewcontroller ()
@property (weak, nonatomic) iboutlet uiimageview *imagev;
@end
@implementation viewcontroller
// 注意： 轉場動畫使用注意點:轉場代碼必須和轉場動畫代碼寫在一起,否則無效
- (void)touchesbegan:(nsset *)touches withevent:(uievent *)event
{
// 實現：圖片瀏覽
/** 轉場代碼 */
static int index = 2;
nsstring *imagename = [nsstring stringwithformat:@"%d",index];
_imagev.image = [uiimage imagenamed:imagename];
index++;
if (index == 4) {
index = 1;
}
/** 轉場動畫代碼 */
// 創建轉場動畫對象
catransition *anim = [catransition animation];
// 設置轉場類型
anim.type = @"pagecurl";
// 設置動畫的方向
anim.subtype = kcatransitionfromleft;
anim.duration = 3;
[_imagev.layer addanimation:anim forkey:nil];
}
@end
2、圖標3d翻轉：使用uiview自帶的單視圖的轉場動畫函數實現
代碼實現
#import "viewcontroller.h"
@interface viewcontroller ()
@property (weak, nonatomic) uiimageview *iconview;
@end
@implementation viewcontroller
- (void)viewdidload{
[super viewdidload];
uiimageview *iconview = [[uiimageview alloc] initwithimage:[uiimage imagenamed:@"1"]];
[self.view addsubview:iconview];
iconview.center = self.view.center;
iconview.backgroundcolor = [uicolor greencolor];
self.iconview = iconview;
// 設置為圓角圖片
self.iconview.layer.cornerradius = self.iconview.frame.size.width * 0.5;
self.iconview.clipstobounds = yes;
}
- (void)touchesbegan:(nsset *)touches withevent:(uievent *)event
{
// uiview自帶的轉場動畫
[uiview transitionwithview:self.iconview duration:1.0 options:uiviewanimationoptiontransitionflipfromleft animations:^{ /** 執行左翻轉動畫，*/
// 從左邊翻轉 ， 之前設置顯示圖片1，翻轉后顯示圖2 -》圖片1 左翻轉到最后顯示圖片2
self.iconview.image = [uiimage imagenamed:@"2"];
} completion:^(bool finished) {
nslog(@"completion");
/** 左翻轉動畫 結束后， 停 1 秒后，再執行 右翻轉動畫 */
dispatch_after(dispatch_time(dispatch_time_now, (int64_t)(1.0 * nsec_per_sec)), dispatch_get_main_queue(), ^{ // 停 1 秒后，再執行 右翻轉動畫
[uiview transitionwithview:self.iconview duration:1.0 options:uiviewanimationoptiontransitionflipfromright animations:^{ // 然后，從右邊翻轉，翻轉時顯示圖片1 -》圖片2 右翻轉最后顯示圖片1
self.iconview.image = [uiimage imagenamed:@"1"];
} completion:nil];
});
}];
}
@end
3、視圖間轉場動畫：使用uiview自帶雙視圖間的轉場動畫函數實現
#import "viewcontroller.h"
@interface viewcontroller ()
@property (weak, nonatomic) iboutlet uiscrollview *scrollview;
/**< imageview1 */
@property (nonatomic, strong) uiview *view1;
/**< imageview2 */
@property (nonatomic, strong) uiview *view2;
@end
@implementation viewcontroller
- (void)viewdidload{
[super viewdidload];
self.view.backgroundcolor = [uicolor blackcolor];
// 1. scrollview 添加 view2 子控件
uiview *view2 = [[uiview alloc] init];
view2.backgroundcolor = [uicolor greencolor];
[self.scrollview addsubview:view2];
self.view2 = view2;
// 2. scrollview 添加 view1 子控件
uiview *view1 = [[uiview alloc] init];
view1.backgroundcolor = [uicolor redcolor];
[self.scrollview addsubview:view1];
self.view1 = view1;
// 3. frame
cgfloat scrollvieww = self.scrollview.frame.size.width;
cgfloat scrollviewh = self.scrollview.frame.size.height;
view1.frame = cgrectmake(0, 0, scrollvieww, scrollviewh);
view2.frame = cgrectmake(0, 0, scrollvieww, scrollviewh); // cgrectmake(scrollvieww, 0, scrollvieww, scrollviewh);
// 4. scrollview
self.scrollview.contentsize = cgsizemake(scrollvieww, scrollviewh);
// 添加手勢
uitapgesturerecognizer *tap = [[uitapgesturerecognizer alloc] initwithtarget:self action:@selector(tapclick:)];
[self.scrollview addgesturerecognizer:tap];
}
int i = 1;
// 監聽到點擊scrollview，進行翻轉動畫
- (void)tapclick:(uitapgesturerecognizer *)tap{
if (i % 2 != 0) {
[uiview transitionfromview:self.view1 toview:self.view2 duration:1.0 options:uiviewanimationoptiontransitionflipfromtop completion:nil];
}else{
[uiview transitionfromview:self.view2 toview:self.view1 duration:1.0 options:uiviewanimationoptiontransitionflipfrombottom completion:nil];
}
i++;
}
