iOS動畫效果和實現

    動畫效果提供了狀態或頁面轉換時流暢的使用者體驗，在iOS系統中，咱們不需要自己編寫繪製動畫的代碼，Core Animation提供了豐富的api來實現你需要的動畫效果。

    UIKit只用UIView來展示動畫,動畫支援UIView下面的這些屬性改變：

• frame  
• bounds  
• center  
• transform  
• alpha 
• backgroundColor 
• contentStretch

1、commitAnimations方式使用UIView動畫

- (void)viewDidLoad{    [super viewDidLoad];        UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];        [button setTitle:@"改變" forState:UIControlStateNormal];    button.frame = CGRectMake(10, 10, 60, 40);    [button addTarget:self action:@selector(changeUIView) forControlEvents:UIControlEventTouchUpInside];    [self.view addSubview:button];    }- (void)changeUIView{    [UIView beginAnimations:@"animation" context:nil];[UIView setAnimationDuration:1.0f];[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES];    [UIView commitAnimations]; }

下面是點擊改變後的效果（兩種）：

動畫的常量有一下四種

   UIViewAnimationTransitionNone,   UIViewAnimationTransitionFlipFromLeft,   UIViewAnimationTransitionFlipFromRight,   UIViewAnimationTransitionCurlUp,   UIViewAnimationTransitionCurlDown,

1.2 交換本視圖控制器中2個view位置

 [self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:0];

先添加兩個view ,一個redview  一個yellowview

- (void)viewDidLoad{    [super viewDidLoad];    UIView *redView = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];    redView.backgroundColor = [UIColor redColor];    [self.view addSubview:redView];        UIView *yellowView = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];    yellowView.backgroundColor = [UIColor yellowColor];    [self.view addSubview:yellowView];        UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];    [button setTitle:@"改變" forState:UIControlStateNormal];    button.frame = CGRectMake(10, 10, 300, 40);    [button addTarget:self action:@selector(changeUIView) forControlEvents:UIControlEventTouchUpInside];    [self.view addSubview:button];        UIButton *button1 = [UIButton buttonWithType:UIButtonTypeRoundedRect];    [button1 setTitle:@"改變1" forState:UIControlStateNormal];    button1.frame = CGRectMake(10, 60, 300, 40);    [button1 addTarget:self action:@selector(changeUIView1) forControlEvents:UIControlEventTouchUpInside];    [self.view addSubview:button1];    }

- (void)changeUIView1{    [UIView beginAnimations:@"animation" context:nil];[UIView setAnimationDuration:1.0f];[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];    [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.view cache:YES];    //  交換本視圖控制器中2個view位置    [self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:0];    [UIView commitAnimations];}

這樣看起來就像兩頁一樣了。1.3 、   [UIView setAnimationDidStopSelector:@selector(animationFinish:)];

在commitAnimations訊息之前，可以設定動畫完成後的回調，設定方法是：

    [UIView setAnimationDidStopSelector:@selector(animationFinish:)];

2、使用：CATransition

- (void)changeUIView2{    CATransition *transition = [CATransition animation];    transition.duration = 2.0f;      transition.type = kCATransitionPush;    transition.subtype = kCATransitionFromTop;    [self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:0];    [self.view.layer addAnimation:transition forKey:@"animation"];}

transition.type 的類型可以有

淡化、推擠、揭開、覆蓋

NSString * const kCATransitionFade;

NSString * const kCATransitionMoveIn;

NSString * const kCATransitionPush;

NSString * const kCATransitionReveal;

這四種，

transition.subtype 也有四種

NSString * const kCATransitionFromRight;

NSString * const kCATransitionFromLeft;

NSString * const kCATransitionFromTop;

NSString * const kCATransitionFromBottom;

2.2 私人的類型的動畫類型：

立方體、吸收、翻轉、波紋、翻頁、反翻頁、鏡頭開、鏡頭關

animation.type = @"cube"animation.type = @"suckEffect"; animation.type = @"oglFlip";//不管subType is "fromLeft" or "fromRight",official只有一種效果animation.type = @"rippleEffect"; animation.type = @"pageCurl"; animation.type = @"pageUnCurl"animation.type = @"cameraIrisHollowOpen ";animation.type = @"cameraIrisHollowClose ";

是第一個cube立方體的效果：

2.3 CATransition的 startProgress  endProgress屬性這兩個屬性是float類型的。
可以控制動畫進行的過程，可以讓動畫停留在某個動畫點上，值在0.0到1.0之間。endProgress要大於等於startProgress。比如上面的立方體轉到，可以設定endProgress= 0.5，讓動畫停留在轉動一般的位置。上面這些私人的動畫效果，在實際應用中要謹慎使用。因為在app store審核時可能會以為這些動畫效果而拒絕通過。3、UIView的 + (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion方法。這個方法是在iOS4.0之後才支援的。比 1 裡的UIView的方法簡潔方便使用。DidView裡添加moveView。

    moveView = [[UIView alloc] initWithFrame:CGRectMake(10, 180, 200, 40)];    moveView.backgroundColor = [UIColor blackColor];    [self.view addSubview:moveView];

- (void)changeUIView3{    [UIView animateWithDuration:3 animations:^(void){        moveView.frame = CGRectMake(10, 270, 200, 40);    }completion:^(BOOL finished){        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(20, 20, 40, 40)];        label.backgroundColor = [UIColor blackColor];        [self.view addSubview:label];    }];}

然後用UIView animateWithDuration動畫移動，移動動畫完畢後添加一個Label。
3.2、 animateWithDuration的嵌套使用

- (void)changeUIView3{         [UIView animateWithDuration:2                          delay:0                        options:UIViewAnimationOptionCurveEaseOut animations:^(void){        moveView.alpha = 0.0;    }completion:^(BOOL finished){        [UIView animateWithDuration:1                              delay:1.0                            options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat                         animations:^(void){                             [UIView setAnimationRepeatCount:2.5];                             moveView.alpha = 1.0;                         }completion:^(BOOL finished){                                                      }];            }];}

這個嵌套的效果是先把view變成透明，在從透明變成不透明，重複2.5次透明到不透明的效果。

文中例子的代碼：AnimateDemo

容芳志 (http://blog.csdn.net/totogo2010)

本文遵循“署名-非商業用途-保持一致”創作公用協議