IOS中的動畫使用

征途LN發表於2013-12-20

IOS中的動畫右兩大類1.UIView的檢視動畫2.Layer的動畫 UIView的動畫也是基於Layer的動畫

動畫的程式碼格式都很固定


1.UIView動畫 :一般方式

[UIView beginAnimations:@"ddd" context:nil];//設定動畫

[UIView commitAnimations]; //提交動畫

這兩個是必須有的,然後在兩句的中間新增動畫的程式碼


[UIView beginAnimations:@"ddd" context:nil];//設定動畫 ddd為動畫名稱

[UIView setAnimationDuration:3];//定義動畫持續時間

[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; //setAnimationCurve來定義動畫加速或減速方式

[UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.window cache:YES];

//設定動畫的樣式  forView為哪個view實現這個動畫效果

[UIView setAnimationDelay:3]; //設定動畫延遲多久執行

[UIView setAnimationDelegate:self];  //設定動畫的代理 實現動畫執行前後的方法 commitAnimation之前設定

[UIView setAnimationDidStopSelector:@selector(stop)];//設定動畫結束後執行的方法

[UIView setAnimationWillStartSelector:@selector(star)];//設定動畫將要開始執行的方法

[UIView commitAnimations]; //提交動畫

typedef enum {

    UIViewAnimationTransitionNone,  //普通狀態

    UIViewAnimationTransitionFlipFromLeft,  //從左往右翻轉

    UIViewAnimationTransitionFlipFromRight,  //從右往左翻轉

    UIViewAnimationTransitionCurlUp, //向上翻頁

    UIViewAnimationTransitionCurlDown, //向下翻頁

} UIViewAnimationTransition;

typedef enum {

    UIViewAnimationCurveEaseInOut,

    UIViewAnimationCurveEaseIn,

    UIViewAnimationCurveEaseOut,

    UIViewAnimationCurveLinear

} UIViewAnimationCurve;


[UIView beginAnimations:@"ddd" context:nil]; //設定動畫

view.frame = CGRectMake(200200100100);

[UIView commitAnimations]; //提交動畫

view從本來的frame移動到新的frame時會慢慢漸變 而不是一下就完成了 中間也可以新增到上面那段中間 只是多種效果重疊


以下這些也可以加到  [UIView beginAnimations:@"ddd" context:nil]; [UIView commitAnimations];之間


view.transform = CGAffineTransformMakeTranslation(1010);//設定偏移量 相對於最初的 只能偏移一次

view.transform = CGAffineTransformTranslate(view.transform, 1010); //設定偏移量 偏移多次


self.view.transform = CGAffineTransformMakeRotation(M_PI);//設定旋轉度 只能旋轉一次

self.view.transform = CGAffineTransformRotate(self.view.transform, M_PI); //旋轉多次


self.view.transform = CGAffineTransformMakeScale(1.11.1); //設定大小 只能改變一次 數值時相對於本來的幾倍

self.view.transform = CGAffineTransformScale(self.view.transform, 1.11.1);//改變多次


self.view.transform = CGAffineTransformIdentity;//回到當初的樣子 執行一次

self.view.transform = CGAffineTransformInvert(self.view.transform);//得到相反的樣子 大小 方向 位置執行多次


Block方式

[UIView animateWithDuration:3 animations:^(void){

    

    //這裡相當於在begincommint之間

}completion:^(BOOL finished){

    //這裡相當於動畫執行完成後要執行的方法,可以繼續巢狀block

}];


2.CAAnimation

需要新增庫,和包含標頭檔案



caanimation有多個子類


CABasicAnimation


CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"opacity"];

//@""裡的字串有多種,可以自己找相關資料,一定要填對,動畫才會執行 opacity設定透明度 bounds.size設定大小

[animation setFromValue:[NSNumber numberWithFloat:1.0]]; //設定透明度從幾開始

[animation setToValue:[NSNumber numberWithFloat:0.3]];//設定透明度到幾結束

[animation setDuration:0.1]; //設定動畫時間

[animation setRepeatCount:100000];//設定重複時間

[animation setRepeatDuration:4];  //會限制重複次數

[animation setAutoreverses:NO];//設定是否從1.00.3 再從0.31.0 為一次  如果設定為NO 1.00.3為一次

[animation setRemovedOnCompletion:YES]; //完成時移出動畫 預設也是

[view.layer addAnimation:animation forKey:@"abc"];//執行動畫


CAKeyframeAnimation


CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];//設定view從初始位置經過一系列點

NSArray *postionAraay = [NSArray arrayWithObjects:[NSValue valueWithCGPoint:CGPointMake(10020)], [NSValue valueWithCGPoint:CGPointMake(4080)],[NSValue valueWithCGPoint:CGPointMake(3060)],[NSValue valueWithCGPoint:CGPointMake(2040)],[NSValue valueWithCGPoint:CGPointMake(0100)],nil];//設定點


NSArray *times = [NSArray arrayWithObjects:[NSNumber numberWithFloat:0.3],[NSNumbernumberWithFloat:0.5],[NSNumber numberWithFloat:0.6],[NSNumber numberWithFloat:0.1],[NSNumbernumberWithFloat:1.0], nil];  //設定移動過程的時間


[animation setKeyTimes:times];

[animation setValues:postionAraay];

[animation setDuration:5]; //設定動畫時間

[bigImage.layer addAnimation:animation forKey:@"dd"]; //執行動畫


CATransition


CATransition *animation = [CATransition animation];

animation.duration = 0.5f;

animation.timingFunction = UIViewAnimationCurveEaseInOut;

animation.fillMode = kCAFillModeForwards;

/*

 kCATransitionFade;

 kCATransitionMoveIn;

 kCATransitionPush;

 kCATransitionReveal;

 */

/*

 kCATransitionFromRight;

 kCATransitionFromLeft;

 kCATransitionFromTop;

 kCATransitionFromBottom;

 */

animation.type = kCATransitionPush;

animation.subtype = kCATransitionFromBottom;

[view.layer addAnimation:animation forKey:animation];

type也可以直接用字串

/*

 cube

 suckEffect 捲走

 oglFlip    翻轉

 rippleEffect  水波

 pageCurl   翻頁

 pageUnCurl

 cameraIrisHollowOpen

 cameraIrisHollowClose

 */


相關文章