iOS開發之動畫編程的幾種方法

iOS開發之動畫編程的幾種方法

IOS中的動畫總結來講有五種：UIView<block>，CAAnimation<CABasicAnimation，CATransition，CAKeyframeAnimation>，NSTimer

這裏我就總結了一下這五種方法，其實iOS開發中動畫的編程都會在這裏面變化，因此只要弄懂了這些動畫編程就不難了。

 

一：UIView動畫

通常方式

1. [UIView beginAnimations:@"ddd" context:nil];//設置動畫
2. [UIView commitAnimations]; //提交動畫
3. 這兩個是必須有的，而後在兩句的中間添加動畫的代碼
4. [UIView beginAnimations:@"ddd" context:nil];//設置動畫 ddd爲動畫名稱
5. [UIView setAnimationDuration:3];//定義動畫持續時間
6. [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; //setAnimationCurve來定義動畫加速或減速方式
7. [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.window cache:YES];
8. //設置動畫的樣式 forView爲哪一個view實現這個動畫效果
9. [UIView setAnimationDelay:3]; //設置動畫延遲多久執行
10. [UIView setAnimationDelegate:self]; //設置動畫的代理 實現動畫執行先後的方法 在commitAnimation以前設置
11. [UIView setAnimationDidStopSelector:@selector(stop)];//設置動畫結束後執行的方法
12. [UIView setAnimationWillStartSelector:@selector(star)];//設置動畫將要開始執行的方法
13. [UIView commitAnimations]; //提交動畫

• typedef enum {
• UIViewAnimationTransitionNone, //普通狀態
• UIViewAnimationTransitionFlipFromLeft, //從左往右翻轉
• UIViewAnimationTransitionFlipFromRight, //從右往左翻轉
• UIViewAnimationTransitionCurlUp, //向上翻頁
• UIViewAnimationTransitionCurlDown, //向下翻頁
• } UIViewAnimationTransition;

• typedef enum {
• UIViewAnimationCurveEaseInOut,
• UIViewAnimationCurveEaseIn,
• UIViewAnimationCurveEaseOut,
• UIViewAnimationCurveLinear
• } UIViewAnimationCurve;

2. [UIView beginAnimations:@"ddd" context:nil]; //設置動畫
3. view.frame = CGRectMake(200, 200, 100, 100);
4. [UIView commitAnimations]; //提交動畫
5. 當view從原本的frame移動到新的frame時會慢慢漸變 而不是一下就完成了 中間也能夠添加到上面那段中間 只是多種效果重疊
6. 如下這些也能夠加到 [UIView beginAnimations:@"ddd" context:nil]; [UIView commitAnimations];之間
7. view.transform = CGAffineTransformMakeTranslation(10, 10);//設置偏移量 相對於最初的 只能偏移一次
8. view.transform = CGAffineTransformTranslate(view.transform, 10, 10); //設置偏移量 偏移屢次
9. self.view.transform = CGAffineTransformMakeRotation(M_PI);//設置旋轉度 只能旋轉一次
10. self.view.transform = CGAffineTransformRotate(self.view.transform, M_PI); //旋轉屢次
11. self.view.transform = CGAffineTransformMakeScale(1.1, 1.1); //設置大小 只能改變一次 數值時相對於原本的幾倍
12. self.view.transform = CGAffineTransformScale(self.view.transform, 1.1, 1.1);//改變屢次
13. self.view.transform = CGAffineTransformIdentity;//回到當初的樣子 執行一次
14. self.view.transform = CGAffineTransformInvert(self.view.transform);//獲得相反的樣子 大小 方向 位置執行屢次

 

這裏我實現了一個自定義的動畫方法，方便使用，只須要調用就能夠實現很好的功能。

 

方法的實現

-(void)UIViewAnimation:(UIView* )view frame:(CGRect)frame type:(int)type alpha:(float)alpha duration:(float)duration

{

//將對應的參數實如今方法中，調用的時候只須要輸入方法中所須要的參數就能很好的調用這個方法，而且實現想要的功能！

    [UIView beginAnimations:nil context:nil];

    [UIView setAnimationDuration:duration];

    [UIView setAnimationCurve:type];

    [UIView setAnimationDelegate:self];

    view.alpha=alpha;

    view.frame=frame;

    [UIView commitAnimations];

}

調用方法

[self UIViewAnimation:downView frame:CGRectMake(0, height, 320, 58) type:UIViewAnimationCurveEaseOut alpha:1 duration:0.3];

 

Block方式

 

1. [UIView animateWithDuration:3 animations:^(void){
3. //這裏至關於在begin和commint之間
4. }completion:^(BOOL finished){
5. //這裏至關於動畫執行完成後要執行的方法，能夠繼續嵌套block
6. }];

 高級一點的block動畫（Next）內嵌

- (void)changeUIView{  

    [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){                   

           }];       

    }];  

}  

 

二：.CAAnimation

須要添加庫，和包含頭文件

caanimation有多個子類

CABasicAnimation

1. CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"opacity"];
2. //@""裏的字符串有多種，能夠本身找相關資料，必定要填對，動畫纔會執行 opacity設置透明度 bounds.size設置大小
3. [animation setFromValue:[NSNumber numberWithFloat:1.0]]; //設置透明度從幾開始
4. [animation setToValue:[NSNumber numberWithFloat:0.3]];//設置透明度到幾結束
5. [animation setDuration:0.1]; //設置動畫時間
6. [animation setRepeatCount:100000];//設置重複時間
7. [animation setRepeatDuration:4]; //會限制重複次數
8. [animation setAutoreverses:NO];//設置是否從1.0到0.3 再從0.3到1.0 爲一次 若是設置爲NO則 1.0到0.3爲一次
9. [animation setRemovedOnCompletion:YES]; //完成時移出動畫 默認也是
10. [view.layer addAnimation:animation forKey:@"abc"];//執行動畫

 

CAKeyframeAnimation

1. CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];//設置view從初始位置通過一系列點
2. NSArray *postionAraay = [NSArray arrayWithObjects:[NSValue valueWithCGPoint:CGPointMake(100, 20)], [NSValue valueWithCGPoint:CGPointMake(40, 80)],[NSValue
3. valueWithCGPoint:CGPointMake(30, 60)],[NSValue valueWithCGPoint:CGPointMake(20, 40)],[NSValue valueWithCGPoint:CGPointMake(0, 100)],nil];//設置點
5. NSArray *times = [NSArray arrayWithObjects:[NSNumber numberWithFloat:0.3],[NSNumber numberWithFloat:0.5],[NSNumber numberWithFloat:0.6],[NSNumber numberWithFloat:0.1],[NSNumber
6. numberWithFloat:1.0], nil]; //設置移動過程的時間
7. [animation setKeyTimes:times];
8. [animation setValues:postionAraay];
9. [animation setDuration:5]; //設置動畫時間
10. [bigImage.layer addAnimation:animation forKey:@"dd"]; //執行動畫

 

CATransition

1. CATransition *animation = [CATransition animation];
2. animation.duration = 0.5f;
3. animation.timingFunction = UIViewAnimationCurveEaseInOut;
4. animation.fillMode = kCAFillModeForwards;

• /*
• kCATransitionFade;
• kCATransitionMoveIn;
• kCATransitionPush;
• kCATransitionReveal;
• */
• /*
• kCATransitionFromRight;
• kCATransitionFromLeft;
• kCATransitionFromTop;
• kCATransitionFromBottom;
• */

1. animation.type = kCATransitionPush;
2. animation.subtype = kCATransitionFromBottom;
3. [view.layer addAnimation:animation forKey:animation];
4. type也能夠直接用字符串

• /*
• cube
• suckEffect 捲走
• oglFlip 翻轉
• rippleEffect 水波
• pageCurl 翻頁
• pageUnCurl
• cameraIrisHollowOpen
• cameraIrisHollowClose
• */

 

三：NSTimer

這是一種定時器來操做動畫的方法，他能夠結合上面的方法來實現動畫的多樣化！

1. -(void) onTimer {
2. imageView.center = CGPointMake(imageView.center.x + delta.x,
3. imageView.center.y + delta.y);
4. if (imageView.center.x > self.view.bounds.size.width - ballRadius ||
5. imageView.center.x < ballRadius)
6. delta.x = -delta.x;
7. if (imageView.center.y > self.view.bounds.size.height - ballRadius ||
8. imageView.center.y < ballRadius)
9. delta.y = -delta.y;
10. }
11. - (void) viewDidLoad {
12. ballRadius = imageView.bounds.size.width / 2;
13. [slider setShowValue:YES];
14. delta = CGPointMake(12.0,4.0);
15. timer = [NSTimer scheduledTimerWithTimeInterval:slider.value
16. target:self
17. selector:@selector(onTimer)
18. userInfo:nil
19. repeats:YES];
20. [super viewDidLoad];
21. }
22. -(IBAction) sliderMoved:(id) sender {
23. [timer invalidate];
24. timer = [NSTimer scheduledTimerWithTimeInterval:slider.value
25. target:self
26. selector:@selector(onTimer)
27. userInfo:nil
28. repeats:YES];
29. //
    1. timer = [NSTimer scheduledTimerWithTimeInterval:?
    2. invocation:?
    3. repeats:YES];
30. }