ios 各種動畫animate效果
//開始動畫
[UIView beginAnimations:nil context:nil];
//設定動畫持續時間
[UIView setAnimationDuration:2];
//動畫的內容
frame.origin.x += 150;
[img setFrame:frame];
//動畫結束
[UIView commitAnimations];
連續動畫:一個接一個地顯示一系列的影象
NSArray *myImages = [NSArray arrayWithObjects:
[UIImage imageNamed:@"myImage1.png"],
[UIImage imageNamed:@"myImage2.png"],
[UIImage imageNamed:@"myImage3.png"],
[UIImage imageNamed:@"myImage4.gif"], nil];
UIImageView *myAnimatedView = [UIImageView alloc];
[myAnimatedView initWithFrame:[self bounds]];
myAnimatedView.animationImages = myImages; //animationImages屬性返回一個存放動畫圖片的陣列
myAnimatedView.animationDuration = 0.25; //瀏覽整個圖片一次所用的時間
myAnimatedView.animationRepeatCount = 0; // 0 = loops forever 動畫重複次數
[myAnimatedView startAnimating];
[self addSubview:myAnimatedView];
[myAnimatedView release];
CATransition Public API動畫:
CATransition *animation = [CATransition animation];
//動畫時間
animation.duration = 0.5f;
//先慢後快
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.fillMode = kCAFillModeForwards;
//animation.removedOnCompletion = NO;
//各種動畫效果
/*
kCATransitionFade;
kCATransitionMoveIn;
kCATransitionPush;z
kCATransitionReveal;
*/
/*
kCATransitionFromRight;
kCATransitionFromLeft;
kCATransitionFromTop;
kCATransitionFromBottom;
*/
//各種組合
animation.type = kCATransitionPush;
animation.subtype = kCATransitionFromRight;
[self.view.layer addAnimation:animation forKey:@"animation"];
CATransition Private API動畫:
animation.type可以設定為以下效果
動畫效果彙總:
/*
suckEffect（三角）
rippleEffect（水波抖動）
pageCurl（上翻頁）
pageUnCurl（下翻頁）
oglFlip（上下翻轉）
cameraIris/cameraIrisHollowOpen/cameraIrisHollowClose （鏡頭快門，這一組動畫是有效果，只是很難看，不建議使用
而以下為則黑名單：
spewEffect: 新版面在螢幕下方中間位置被釋放出來覆蓋舊版面.
- genieEffect: 舊版面在螢幕左下方或右下方被吸走, 顯示出下面的新版面 (阿拉丁燈神?).
- unGenieEffect: 新版面在螢幕左下方或右下方被釋放出來覆蓋舊版面.
- twist: 版面以水平方向像龍捲風式轉出來.
- tubey: 版面垂直附有彈性的轉出來.
- swirl: 舊版面360度旋轉並淡出, 顯示出新版面.
- charminUltra: 舊版面淡出並顯示新版面.
- zoomyIn: 新版面由小放大走到前面, 舊版面放大由前面消失.
- zoomyOut: 新版面螢幕外面縮放出現, 舊版面縮小消失.
- oglApplicationSuspend: 像按"home" 按鈕的效果.
*/
UIView Animations 動畫:
[UIView beginAnimations:@"animationID" context:nil];
[UIView setAnimationDuration:0.5f];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationRepeatAutoreverses:NO];
//以下四種效果
/*
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.view cache:YES];//oglFlip, fromLeft
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES];//oglFlip, fromRight
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.view cache:YES];
[UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.view cache:YES];
*/
[self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:0];
[UIView commitAnimations];
IOS4.0新方法:
方法: +(void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations;
+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion; //多一個動畫結束後可以執行的操作.
//下邊是巢狀使用,先變大再消失的動畫效果.
[UIView animateWithDuration:1.25 animations:^{
CGAffineTransform newTransform = CGAffineTransformMakeScale(1.2, 1.2);
[firstImageView setTransform:newTransform];
[secondImageView setTransform:newTransform];}
completion:^(BOOL finished){
[UIView animateWithDuration:1.2 animations:^{
[firstImageView setAlpha:0];
[secondImageView setAlpha:0];} completion:^(BOOL finished){
[firstImageView removeFromSuperview];
[secondImageView removeFromSuperview]; }];
}];
一.基本方式:使用UIView類的UIViewAnimation擴充套件
+ (void)beginAnimations:(NSString *)animationID context:(void *)context; // 開始準備動畫+ (void)commitAnimations; // 執行動畫
// 沒有get方法,下面的set在快外呼叫無效+ (void)setAnimationDelegate:(id)delegate; // 委託default = nil+ (void)setAnimationWillStartSelector:(SEL)selector; // default = NULL. -animationWillStart:(NSString *)animationID context:(void *)context+ (void)setAnimationDidStopSelector:(SEL)selector; // default = NULL. -animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context+ (void)setAnimationDuration:(NSTimeInterval)duration; // default = 0.2動畫時間+ (void)setAnimationDelay:(NSTimeInterval)delay; // default = 0.0延遲多少時間開始執行動畫+ (void)setAnimationStartDate:(NSDate *)startDate; // default = now ([NSDate date])動畫開始日期?不知道啥用.- -+ (void)setAnimationCurve:(UIViewAnimationCurve)curve; // default = UIViewAnimationCurveEaseInOut動畫方式+ (void)setAnimationRepeatCount:(float)repeatCount; // default = 0.0. May be fractional重複次數+ (void)setAnimationRepeatAutoreverses:(BOOL)repeatAutoreverses; // default = NO. YES的話,動畫(非最後一次)結束後動態復原到最開始狀態+ (void)setAnimationBeginsFromCurrentState:(BOOL)fromCurrentState; // default = NO. YES,停止之前的動畫,從現在這裡開始新動畫the current view position is always used for new animations -- allowing animations to "pile up" on each other. Otherwise, the last end state is used for the animation (the default).
+ (void)setAnimationTransition:(UIViewAnimationTransition)transition forView:(UIView *)view cache:(BOOL)cache; // 新增動畫到view上,cache是YES的時候比較高效,但是動畫過程中不能更新介面上的內容,NO時每一幀都重新畫,可以實時更新+ (void)setAnimationsEnabled:(BOOL)enabled; // 是否忽略一些動畫設定+ (BOOL)areAnimationsEnabled;
一個動畫的程式碼
[UIView beginAnimations:nil context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
[UIView setAnimationDuration:2.7];
[UIView setAnimationTransition:transition forView:self.view cache:YES];
// operation>>>[self.view exchangeSubviewAtIndex:0 withSubviewAtIndex:1];
// end<<<<<<[UIView commitAnimations];
其中transition取值範圍
typedef enum {
UIViewAnimationTransitionNone,
UIViewAnimationTransitionFlipFromLeft,
UIViewAnimationTransitionFlipFromRight,
UIViewAnimationTransitionCurlUp,
UIViewAnimationTransitionCurlDown,
} UIViewAnimationTransition;
特點:基礎,使用方便,但是效果有限
二.block方式:使用UIView類的UIViewAnimationWithBlocks擴充套件
函式說明
+ (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion __OSX_AVAILABLE_STARTING(__MAC_NA,__IPHONE_4_0);//間隔,延遲,動畫引數(好像沒用?),介面更改塊,結束塊
+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion
+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations
+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion __OSX_AVAILABLE_STARTING(__MAC_NA,__IPHONE_4_0); // toView added to fromView.superview, fromView removed from its superview介面替換,這裡的options引數有效
舉例:
[UIView animateWithDuration:0.7 delay:0 options:0 animations:^(){
self.view.alpha = 0.2;
[self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:0];
self.view.alpha = 1;
} completion:^(BOOL finished)
{
}];
當areAnimationsEnabled為NO時,上面不能動畫顯示
[UIView transitionFromView:lImage toView:mImage duration:0.7 options:options completion:^(BOOL finished)
{
if (finished) {
[self.view addSubview:lImage];
[self.view sendSubviewToBack:lImage];
[self.view sendSubviewToBack:mImage];
}
}];
options取值範圍
enum {
UIViewAnimationOptionLayoutSubviews = 1 << 0,
UIViewAnimationOptionAllowUserInteraction = 1 << 1, // turn on user interaction while animatingUIViewAnimationOptionBeginFromCurrentState = 1 << 2, // start all views from current value, not initial valueUIViewAnimationOptionRepeat = 1 << 3, // repeat animation indefinitelyUIViewAnimationOptionAutoreverse = 1 << 4, // if repeat, run animation back and forthUIViewAnimationOptionOverrideInheritedDuration = 1 << 5, // ignore nested durationUIViewAnimationOptionOverrideInheritedCurve = 1 << 6, // ignore nested curveUIViewAnimationOptionAllowAnimatedContent = 1 << 7, // animate contents (applies to transitions only)UIViewAnimationOptionShowHideTransitionViews = 1 << 8, // flip to/from hidden state instead of adding/removing
UIViewAnimationOptionCurveEaseInOut = 0 << 16, // defaultUIViewAnimationOptionCurveEaseIn = 1 << 16,
UIViewAnimationOptionCurveEaseOut = 2 << 16,
UIViewAnimationOptionCurveLinear = 3 << 16,
UIViewAnimationOptionTransitionNone = 0 << 20, // defaultUIViewAnimationOptionTransitionFlipFromLeft = 1 << 20,
UIViewAnimationOptionTransitionFlipFromRight = 2 << 20,
UIViewAnimationOptionTransitionCurlUp = 3 << 20,
UIViewAnimationOptionTransitionCurlDown = 4 << 20,
UIViewAnimationOptionTransitionCrossDissolve = 5 << 20,//ios5UIViewAnimationOptionTransitionFlipFromTop = 6 << 20,//ios5UIViewAnimationOptionTransitionFlipFromBottom = 7 << 20,//ios5};
typedef NSUInteger UIViewAnimationOptions;
特點:快捷方便,效果更多.可以如上示例1那樣實現介面個元素屬性漸進變化的動態展示
對於不太複雜的動畫，上面的寫法很精練，因為只有一條語句，如果動畫太過複雜了，寫在這樣一條語句中就會顯得冗長了，對於程式碼除錯沒那麼方非常方便。三：Core animation
core animation是以objc語言封裝的一套圖形渲染，投影以及動畫的庫的結合，使建立的使用者介面變得非常容易，通過以下方法：
1：使用簡單的程式設計方法實現高效能的合成
2：使用層物件建立複雜的使用者介面。
3：輕量型資料結構，能夠同時使幾百個層產生動畫。
4：不依賴於應用的主執行緒，動畫在單獨的執行緒裡執行
5：改進了應用程式效能。應用程式只需要重畫它變化的部分（區域性重新整理）。
6：靈活的佈局管理方式
2. 相關類
使用core animation,開發者不需要使用底層的API或者OpenGL就可以建立漂亮的動畫介面。
core animation類分成以下幾個：
1：提供顯示內容的層
2：動畫和時間類
3：佈局和約束類
4：將多個層分成幾個原子更新的執行類
2.1 層（layer）
層是core animation的基礎，檢視的一個例項，有一個CALayer例項作為父層(superlayer)以及在這層上新增的所有子層，建立的層結構成為layer tree
2.2動畫和時間類
隱式動畫
層的許多可視屬性的改變可以產生隱式的動畫效果，因為這些屬性都預設與一個動畫相關聯。通過簡單地設定可視的屬性值，層會由當前值到被設定的值產生漸變的動畫效果。比如，設定層的隱藏屬性為真，將觸發一個逐漸消失的動畫效果。
顯式動畫
通過建立一個動畫類和指定所需要的動畫效果，顯式的動畫並不改變層的屬性。
所有的核心動畫類都由抽象類CAAnimation繼承而來。CAAnimation採用CAMediaTiming協議。CAMediaTiming規 定了動畫的持續時間，速度以及重複次數。CAAnimation也採用了CAAction協議，該協議規定了在響應由層觸發的動作時，開始一個動畫的標準 方式。
核心動畫還提供其他的動畫類
CATransition,CATransition規定了影響整個層內容的轉換效果，在動畫期間，它使層產生漸變(fade),推拉(push)以及揭示(reveal)的動畫效果。這些常用的轉換效果可以通過核心繪圖過濾器進行擴充套件。
CAAnimation,CAAnimation允許大量的動畫物件被分為幾組，並且可以同時執行。
CAPropertyAnimation,是CAAnimation的子類，支援層在動畫期間，為層指定一個關鍵路徑。
CABasicAnimation.該類為層的屬性提供了簡單的插值。
CAKeyframeAnimation,CAKeyframeAnimation提供關鍵幀動畫的支援。你可以為層的屬性指定一個關鍵路徑
2.3佈局管理類
CAKeyframeAnimation類用於管理所有子層的佈局，每個由CAConstraint類封裝的例項描述了各個子層之間的幾何位置關係。
2.4 執行管理類
可設定動畫層的屬性的修改必須是執行的一部分，CATransaction負責將許多動畫分成幾批原子型的更新進行顯示。
-
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(200, 200, 100, 100);
[UIView commitAnimations]; //提交動畫
當view從本來的frame移動到新的frame時會慢慢漸變 而不是一下就完成了 中間也可以新增到上面那段中間 只是多種效果重疊以下這些也可以加到 [UIView beginAnimations:@"ddd" context:nil]; [UIView commitAnimations];之間
view.transform = CGAffineTransformMakeTranslation(10, 10);//設定偏移量 相對於最初的 只能偏移一次
view.transform = CGAffineTransformTranslate(view.transform, 10, 10); //設定偏移量 偏移多次self.view.transform = CGAffineTransformMakeRotation(M_PI);//設定旋轉度 只能旋轉一次
self.view.transform = CGAffineTransformRotate(self.view.transform, M_PI); //旋轉多次self.view.transform = CGAffineTransformMakeScale(1.1, 1.1); //設定大小 只能改變一次 數值時相對於本來的幾倍
self.view.transform = CGAffineTransformScale(self.view.transform, 1.1, 1.1);//改變多次self.view.transform = CGAffineTransformIdentity;//回到當初的樣子 執行一次
self.view.transform = CGAffineTransformInvert(self.view.transform);//得到相反的樣子 大小 方向 位置執行多次Block方式
[UIView animateWithDuration:3 animations:^(void){
//這裡相當於在begin和commint之間
}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.0到0.3 再從0.3到1.0 為一次 如果設定為NO則 1.0到0.3為一次
[animation setRemovedOnCompletion:YES]; //完成時移出動畫 預設也是
[view.layer addAnimation:animation forKey:@"abc"];//執行動畫CAKeyframeAnimation
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];//設定view從初始位置經過一系列點
NSArray *postionAraay = [NSArray arrayWithObjects:[NSValue valueWithCGPoint:CGPointMake(100, 20)], [NSValue valueWithCGPoint:CGPointMake(40, 80)],[NSValue valueWithCGPoint:CGPointMake(30, 60)],[NSValue valueWithCGPoint:CGPointMake(20, 40)],[NSValue valueWithCGPoint:CGPointMake(0, 100)],nil];//設定點
NSArray *times = [NSArray arrayWithObjects:[NSNumber numberWithFloat:0.3],[NSNumber numberWithFloat:0.5],[NSNumber numberWithFloat:0.6],[NSNumber numberWithFloat:0.1],[NSNumber numberWithFloat: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
*/