Core Animation簡(jiǎn)介
- Core Animation,中文翻譯為核心動(dòng)畫,它是一組非常強(qiáng)大的動(dòng)畫處 理API,使用它能做出非常炫麗的動(dòng)畫效果,而且往往是事半功倍蕴坪。 也就是說,使用少量的代碼就可以實(shí)現(xiàn)非常強(qiáng)大的功能液茎。
- Core Animation可以用在Mac OS X和iOS平臺(tái)辞嗡。
- Core Animation的動(dòng)畫執(zhí)行過程都是在后臺(tái)操作的,不會(huì)阻塞主線程。
- 要注意的是,Core Animation是直接作用在CALayer上的,并非UIView续室。
Core Animation的使用步驟
- 如果不是xcode5之后的版本,使用它需要先添加QuartzCore.framework和引入對(duì)應(yīng)的框架<QuartzCore/QuartzCore.h>
- 開發(fā)步驟:
- 1.首先得有CALayer
- 2.初始化一個(gè)CAAnimation對(duì)象,并設(shè)置一些動(dòng)畫相關(guān)屬性
- 3.通過調(diào)用CALayer的addAnimation:forKey:方法,增加CAAnimation對(duì) 象到CALayer中,這樣就能開始執(zhí)行動(dòng)畫
- 4.通過調(diào)用CALayer的removeAnimationForKey:方法可以停止CALayer 中的動(dòng)畫
CAAnimation——簡(jiǎn)介
- 是所有動(dòng)畫對(duì)象的父類,負(fù)責(zé)控制動(dòng)畫的持續(xù)時(shí)間和速度,是個(gè)抽象類,不能直接使用,應(yīng)該使用它具體的子類
- 屬性說明:(藍(lán)色代表來自CAMediaTiming協(xié)議的屬性)
- duration :動(dòng)畫持續(xù)時(shí)間
- repeatCount:重復(fù)次數(shù),無限循環(huán)可以設(shè)置HUGE_VALF或者M(jìn)AXFLOAT
- duration:重復(fù)時(shí)間
- removedOnCompletion:默認(rèn)為YES,代表動(dòng)畫執(zhí)行完畢后就從圖層上移除,圖形會(huì) 恢復(fù)到動(dòng)畫執(zhí)行前的狀態(tài)。如果想讓圖層保持顯示動(dòng)畫執(zhí)行后的狀態(tài),那就設(shè)置 為NO,不過還要設(shè)置fillMode為kCAFillModeForwards
- fillMode:決定當(dāng)前對(duì)象在非active時(shí)間段的行為明郭。比如動(dòng)畫開始之前或者動(dòng)畫結(jié)束之后
- beginTime:可以用來設(shè)置動(dòng)畫延遲執(zhí)行時(shí)間,若想延遲2s,就設(shè)置 為CACurrentMediaTime()+2,CACurrentMediaTime()為圖層的當(dāng)前時(shí)間
- timingFunction:速度控制函數(shù),控制動(dòng)畫運(yùn)行的節(jié)奏
- delegate:動(dòng)畫代理
CAAnimation——?jiǎng)赢嬏畛淠Ｊ?/h1>
- fillMode屬性值(要想fillMode有效,最好設(shè)置removedOnCompletion = NO)
-
kCAFillModeRemoved 這個(gè)是默認(rèn)值,也就是說當(dāng)動(dòng)畫開始前和動(dòng)畫結(jié)束后,動(dòng)畫對(duì)layer都沒有影響,動(dòng)畫結(jié)束后,layer會(huì)恢復(fù)到之前的狀態(tài)
-
kCAFillModeForwards 當(dāng)動(dòng)畫結(jié)束后,layer會(huì)一直保持著動(dòng)畫最后的狀態(tài)
-
kCAFillModeBackwards 在動(dòng)畫開始前,只需要將動(dòng)畫加入了一個(gè)layer,layer便立即進(jìn) 入動(dòng)畫的初始狀態(tài)并等待動(dòng)畫開始丰泊。
-
kCAFillModeBoth 這個(gè)其實(shí)就是上面兩個(gè)的合成.動(dòng)畫加入后開始之前,layer便處于動(dòng) 畫初始狀態(tài),動(dòng)畫結(jié)束后layer保持動(dòng)畫最后的狀態(tài)
CAAnimation——速度控制函數(shù)
- 速度控制函數(shù)(CAMediaTimingFunction)
-
kCAMediaTimingFunctionLinear(線性):勻速,給你一個(gè)相對(duì)靜態(tài)的感覺
-
kCAMediaTimingFunctionEaseIn(漸進(jìn)):動(dòng)畫緩慢進(jìn)入,然后加速離開
-
kCAMediaTimingFunctionEaseOut(漸出):動(dòng)畫全速進(jìn)入,然后減速的到達(dá)目 的地
-
kCAMediaTimingFunctionEaseInEaseOut(漸進(jìn)漸出):動(dòng)畫緩慢的進(jìn)入,中間加速,然后減速的到達(dá)目的地。這個(gè)是默認(rèn)的動(dòng)畫行為瞳购。
CAAnimation——?jiǎng)赢嫶矸椒?/h1>
- CAAnimation在分類中定義了代
理方法
@interface NSObject (CAAnimationDelegate)
/* Called when the animation begins its active duration. */
- (void)animationDidStart:(CAAnimation *)anim;
/* Called when the animation either completes its active duration or
* is removed from the object it is attached to (i.e. the layer). 'flag'
* is true if the animation reached the end of its active duration
* without being removed. */
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag;
CALayer上動(dòng)畫的暫停和恢復(fù)
#pragma mark 暫停CALayer的動(dòng)畫 -(void)pauseLayer:(CALayer*)layer {
CFTimeInterval pausedTime = [layer
convertTime:CACurrentMediaTime() fromLayer:nil];
// 讓CALayer的時(shí)間停止走動(dòng) layer.speed = 0.0;
// 讓CALayer的時(shí)間停留在pausedTime這個(gè)時(shí)刻
layer.timeOffset = pausedTime;
}
CALayer上動(dòng)畫的恢復(fù)
#pragma mark 恢復(fù)CALayer的動(dòng)畫 -(void)resumeLayer:(CALayer*)layer {
CFTimeInterval pausedTime = layer.timeOffset;
// 1. 讓CALayer的時(shí)間繼續(xù)行走
layer.speed = 1.0;
// 2. 取消上次記錄的停留時(shí)刻
layer.timeOffset = 0.0; // 3. 取消上次設(shè)置的時(shí)間
layer.beginTime = 0.0;
// 4. 計(jì)算暫停的時(shí)間(這里也可以用CACurrentMediaTime()-pausedTime)
CFTimeInterval timeSincePause = [layer convertTime:CACurrentMediaTime()
fromLayer:nil] - pausedTime;
// 5. 設(shè)置相對(duì)于父坐標(biāo)系的開始時(shí)間(往后退timeSincePause) layer.beginTime = timeSincePause;
}
CAPropertyAnimation
- 是CAAnimation的子類,也是個(gè)抽象類,要想創(chuàng)建動(dòng)畫對(duì)象,應(yīng)該使 用它的兩個(gè)子類:
- CABasicAnimation
- CAKeyframeAnimation
- 屬性說明:
- keyPath:通過指定CALayer的一個(gè)屬性名稱為keyPath(NSString類型), 并且對(duì)CALayer的這個(gè)屬性的值進(jìn)行修改,達(dá)到相應(yīng)的動(dòng)畫效果。比如,指 定@“position”為keyPath,就修改CALayer的position屬性的值,以達(dá)到平移 的動(dòng)畫效果
CABasicAnimation——基本動(dòng)畫
- 基本動(dòng)畫,是CAPropertyAnimation的子類
- 屬性說明:
- fromValue:keyPath相應(yīng)屬性的初始值
- toValue:keyPath相應(yīng)屬性的結(jié)束值
- 動(dòng)畫過程說明:
- 隨著動(dòng)畫的進(jìn)行,在長(zhǎng)度為duration的持續(xù)時(shí)間內(nèi),keyPath相應(yīng)屬性的值從fromValue漸漸地變?yōu)閠oValue
- keyPath內(nèi)容是CALayer的可動(dòng)畫Animatable屬性
- 如果fillMode=kCAFillModeForwards同時(shí)removedOnComletion=NO,那么在 動(dòng)畫執(zhí)行完畢后,圖層會(huì)保持顯示動(dòng)畫執(zhí)行后的狀態(tài)年堆。但在實(shí)質(zhì)上,圖層 的屬性值還是動(dòng)畫執(zhí)行前的初始值,并沒有真正被改變盏浇。
CAKeyframeAnimation——關(guān)鍵幀動(dòng)畫
- 關(guān)鍵幀動(dòng)畫,也是CAPropertyAnimation的子類,與CABasicAnimation的區(qū)別是:
- CABasicAnimation只能從一個(gè)數(shù)值(fromValue)變到另一個(gè)數(shù)值(toValue), 而CAKeyframeAnimation會(huì)使用一個(gè)NSArray保存這些數(shù)值
- 屬性說明:
- values:上述的NSArray對(duì)象变丧。里面的元素稱為“關(guān)鍵幀”(keyframe)绢掰。動(dòng)畫對(duì)象會(huì)在指定的時(shí)間(duration)內(nèi),依次顯示values數(shù)組中的每一個(gè)關(guān)鍵幀
- path:可以設(shè)置一個(gè)CGPathRef、CGMutablePathRef,讓圖層按照路徑軌跡移 動(dòng)滴劲。path只對(duì)CALayer的anchorPoint和position起作用。如果設(shè)置了path,那么values將 被忽略
- keyTimes:可以為對(duì)應(yīng)的關(guān)鍵幀指定對(duì)應(yīng)的時(shí)間點(diǎn),其取值范圍為0到1.0,keyTimes 中的每一個(gè)時(shí)間值都對(duì)應(yīng)values中的每一幀哑芹。如果沒有設(shè)置keyTimes,各個(gè)關(guān)鍵幀的 時(shí)間是平分的
- CABasicAnimation可看做是只有2個(gè)關(guān)鍵幀的CAKeyframeAnimation
- CABasicAnimation可看做是只有2個(gè)關(guān)鍵幀的CAKeyframeAnimation
- 動(dòng)畫組,是CAAnimation的子類,可以保存一組動(dòng)畫對(duì)象,將CAAnimationGroup對(duì)象加入層后,組中所有動(dòng)畫對(duì)象可以同時(shí)并發(fā)運(yùn)行
- 屬性說明:
- animations:用來保存一組動(dòng)畫對(duì)象的NSArray
- 默認(rèn)情況下,一組動(dòng)畫對(duì)象是同時(shí)運(yùn)行的,也可以通過設(shè)置動(dòng)畫對(duì)象的 beginTime屬性來更改動(dòng)畫的開始時(shí)間
轉(zhuǎn)場(chǎng)動(dòng)畫——CATransition
- CATransition是CAAnimation的子類,用于做轉(zhuǎn)場(chǎng)動(dòng)畫,能夠?yàn)閷犹峁?移出屏幕和移入屏幕的動(dòng)畫效果。iOS比Mac OS X的轉(zhuǎn)場(chǎng)動(dòng)畫效果少 一點(diǎn)
- UINavigationController就是通過CATransition實(shí)現(xiàn)了將控制器的視圖推 入屏幕的動(dòng)畫效果
- 動(dòng)畫屬性:
- type:動(dòng)畫過渡類型
- subtype:動(dòng)畫過渡方向
- startProgress:動(dòng)畫起點(diǎn)(在整體動(dòng)畫的百分比)
- endProgress:動(dòng)畫終點(diǎn)(在整體動(dòng)畫的百分比)
轉(zhuǎn)場(chǎng)動(dòng)畫過渡效果
![]()
Snip20160809_1.png
使用UIView動(dòng)畫函數(shù)實(shí)現(xiàn)轉(zhuǎn)場(chǎng)動(dòng)畫——單視 圖
+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options: (UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion;
- 參數(shù)說明:
- duration:動(dòng)畫的持續(xù)時(shí)間
- view:需要進(jìn)行轉(zhuǎn)場(chǎng)動(dòng)畫的視圖
- options:轉(zhuǎn)場(chǎng)動(dòng)畫的類型
- animations:將改變視圖屬性的代碼放在這個(gè)block中
- completion:動(dòng)畫結(jié)束后,會(huì)自動(dòng)調(diào)用這個(gè)block
使用UIView動(dòng)畫函數(shù)實(shí)現(xiàn)轉(zhuǎn)場(chǎng)動(dòng)畫——雙視圖
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration: (NSTimeInterval)duration options: (UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion;
- 參數(shù)說明:
- duration:動(dòng)畫的持續(xù)時(shí)間
- options:轉(zhuǎn)場(chǎng)動(dòng)畫的類型
- animations:將改變視圖屬性的代碼放在這個(gè)block中
- completion:動(dòng)畫結(jié)束后,會(huì)自動(dòng)調(diào)用這個(gè)block
CADisplayLink
- CADisplayLink是一種以屏幕刷新頻率觸發(fā)的時(shí)鐘機(jī)制,每秒鐘執(zhí)行 大約60次左右
- CADisplayLink是一個(gè)計(jì)時(shí)器,可以使繪圖代碼與視圖的刷新頻率保 持同步,而NSTimer無法確保計(jì)時(shí)器實(shí)際被觸發(fā)的準(zhǔn)確時(shí)間
- 使用方法:
- 定義CADisplayLink并制定觸發(fā)調(diào)用方法
- 將顯示鏈接添加到主運(yùn)行循環(huán)隊(duì)列
下面是寫的一個(gè)關(guān)于CoreAnimation的一個(gè)demo
- 源碼地址 ：https://github.com/wjxlogo/CoreAnimation
- 這是效果
![]()
Untitled.gif
- kCAMediaTimingFunctionLinear(線性):勻速,給你一個(gè)相對(duì)靜態(tài)的感覺
- kCAMediaTimingFunctionEaseIn(漸進(jìn)):動(dòng)畫緩慢進(jìn)入,然后加速離開
- kCAMediaTimingFunctionEaseOut(漸出):動(dòng)畫全速進(jìn)入,然后減速的到達(dá)目 的地
- kCAMediaTimingFunctionEaseInEaseOut(漸進(jìn)漸出):動(dòng)畫緩慢的進(jìn)入,中間加速,然后減速的到達(dá)目的地。這個(gè)是默認(rèn)的動(dòng)畫行為瞳购。
- CAAnimation在分類中定義了代
理方法
@interface NSObject (CAAnimationDelegate)
/* Called when the animation begins its active duration. */
- (void)animationDidStart:(CAAnimation *)anim;
/* Called when the animation either completes its active duration or
* is removed from the object it is attached to (i.e. the layer). 'flag'
* is true if the animation reached the end of its active duration
* without being removed. */
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag;
CALayer上動(dòng)畫的暫停和恢復(fù)
#pragma mark 暫停CALayer的動(dòng)畫 -(void)pauseLayer:(CALayer*)layer {
CFTimeInterval pausedTime = [layer
convertTime:CACurrentMediaTime() fromLayer:nil];
// 讓CALayer的時(shí)間停止走動(dòng) layer.speed = 0.0;
// 讓CALayer的時(shí)間停留在pausedTime這個(gè)時(shí)刻
layer.timeOffset = pausedTime;
}
CALayer上動(dòng)畫的恢復(fù)
#pragma mark 恢復(fù)CALayer的動(dòng)畫 -(void)resumeLayer:(CALayer*)layer {
CFTimeInterval pausedTime = layer.timeOffset;
// 1. 讓CALayer的時(shí)間繼續(xù)行走
layer.speed = 1.0;
// 2. 取消上次記錄的停留時(shí)刻
layer.timeOffset = 0.0; // 3. 取消上次設(shè)置的時(shí)間
layer.beginTime = 0.0;
// 4. 計(jì)算暫停的時(shí)間(這里也可以用CACurrentMediaTime()-pausedTime)
CFTimeInterval timeSincePause = [layer convertTime:CACurrentMediaTime()
fromLayer:nil] - pausedTime;
// 5. 設(shè)置相對(duì)于父坐標(biāo)系的開始時(shí)間(往后退timeSincePause) layer.beginTime = timeSincePause;
}
CAPropertyAnimation
- 是CAAnimation的子類,也是個(gè)抽象類,要想創(chuàng)建動(dòng)畫對(duì)象,應(yīng)該使 用它的兩個(gè)子類:
- CABasicAnimation
- CAKeyframeAnimation
- 屬性說明:
- keyPath:通過指定CALayer的一個(gè)屬性名稱為keyPath(NSString類型), 并且對(duì)CALayer的這個(gè)屬性的值進(jìn)行修改,達(dá)到相應(yīng)的動(dòng)畫效果。比如,指 定@“position”為keyPath,就修改CALayer的position屬性的值,以達(dá)到平移 的動(dòng)畫效果
CABasicAnimation——基本動(dòng)畫
- 基本動(dòng)畫,是CAPropertyAnimation的子類
- 屬性說明:
- fromValue:keyPath相應(yīng)屬性的初始值
- toValue:keyPath相應(yīng)屬性的結(jié)束值
- 動(dòng)畫過程說明:
- 隨著動(dòng)畫的進(jìn)行,在長(zhǎng)度為duration的持續(xù)時(shí)間內(nèi),keyPath相應(yīng)屬性的值從fromValue漸漸地變?yōu)閠oValue
- keyPath內(nèi)容是CALayer的可動(dòng)畫Animatable屬性
- 如果fillMode=kCAFillModeForwards同時(shí)removedOnComletion=NO,那么在 動(dòng)畫執(zhí)行完畢后,圖層會(huì)保持顯示動(dòng)畫執(zhí)行后的狀態(tài)年堆。但在實(shí)質(zhì)上,圖層 的屬性值還是動(dòng)畫執(zhí)行前的初始值,并沒有真正被改變盏浇。
CAKeyframeAnimation——關(guān)鍵幀動(dòng)畫
- 關(guān)鍵幀動(dòng)畫,也是CAPropertyAnimation的子類,與CABasicAnimation的區(qū)別是:
- CABasicAnimation只能從一個(gè)數(shù)值(fromValue)變到另一個(gè)數(shù)值(toValue), 而CAKeyframeAnimation會(huì)使用一個(gè)NSArray保存這些數(shù)值
- 屬性說明:
- values:上述的NSArray對(duì)象变丧。里面的元素稱為“關(guān)鍵幀”(keyframe)绢掰。動(dòng)畫對(duì)象會(huì)在指定的時(shí)間(duration)內(nèi),依次顯示values數(shù)組中的每一個(gè)關(guān)鍵幀
- path:可以設(shè)置一個(gè)CGPathRef、CGMutablePathRef,讓圖層按照路徑軌跡移 動(dòng)滴劲。path只對(duì)CALayer的anchorPoint和position起作用。如果設(shè)置了path,那么values將 被忽略
- keyTimes:可以為對(duì)應(yīng)的關(guān)鍵幀指定對(duì)應(yīng)的時(shí)間點(diǎn),其取值范圍為0到1.0,keyTimes 中的每一個(gè)時(shí)間值都對(duì)應(yīng)values中的每一幀哑芹。如果沒有設(shè)置keyTimes,各個(gè)關(guān)鍵幀的 時(shí)間是平分的
- CABasicAnimation可看做是只有2個(gè)關(guān)鍵幀的CAKeyframeAnimation
- CABasicAnimation可看做是只有2個(gè)關(guān)鍵幀的CAKeyframeAnimation
- 動(dòng)畫組,是CAAnimation的子類,可以保存一組動(dòng)畫對(duì)象,將CAAnimationGroup對(duì)象加入層后,組中所有動(dòng)畫對(duì)象可以同時(shí)并發(fā)運(yùn)行
- 屬性說明:
- animations:用來保存一組動(dòng)畫對(duì)象的NSArray
- 默認(rèn)情況下,一組動(dòng)畫對(duì)象是同時(shí)運(yùn)行的,也可以通過設(shè)置動(dòng)畫對(duì)象的 beginTime屬性來更改動(dòng)畫的開始時(shí)間
轉(zhuǎn)場(chǎng)動(dòng)畫——CATransition
- CATransition是CAAnimation的子類,用于做轉(zhuǎn)場(chǎng)動(dòng)畫,能夠?yàn)閷犹峁?移出屏幕和移入屏幕的動(dòng)畫效果。iOS比Mac OS X的轉(zhuǎn)場(chǎng)動(dòng)畫效果少 一點(diǎn)
- UINavigationController就是通過CATransition實(shí)現(xiàn)了將控制器的視圖推 入屏幕的動(dòng)畫效果
- 動(dòng)畫屬性:
- type:動(dòng)畫過渡類型
- subtype:動(dòng)畫過渡方向
- startProgress:動(dòng)畫起點(diǎn)(在整體動(dòng)畫的百分比)
- endProgress:動(dòng)畫終點(diǎn)(在整體動(dòng)畫的百分比)
轉(zhuǎn)場(chǎng)動(dòng)畫過渡效果
Snip20160809_1.png
使用UIView動(dòng)畫函數(shù)實(shí)現(xiàn)轉(zhuǎn)場(chǎng)動(dòng)畫——單視 圖
+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options: (UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion;
- 參數(shù)說明:
- duration:動(dòng)畫的持續(xù)時(shí)間
- view:需要進(jìn)行轉(zhuǎn)場(chǎng)動(dòng)畫的視圖
- options:轉(zhuǎn)場(chǎng)動(dòng)畫的類型
- animations:將改變視圖屬性的代碼放在這個(gè)block中
- completion:動(dòng)畫結(jié)束后,會(huì)自動(dòng)調(diào)用這個(gè)block
使用UIView動(dòng)畫函數(shù)實(shí)現(xiàn)轉(zhuǎn)場(chǎng)動(dòng)畫——雙視圖
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration: (NSTimeInterval)duration options: (UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion;
- 參數(shù)說明:
- duration:動(dòng)畫的持續(xù)時(shí)間
- options:轉(zhuǎn)場(chǎng)動(dòng)畫的類型
- animations:將改變視圖屬性的代碼放在這個(gè)block中
- completion:動(dòng)畫結(jié)束后,會(huì)自動(dòng)調(diào)用這個(gè)block
CADisplayLink
- CADisplayLink是一種以屏幕刷新頻率觸發(fā)的時(shí)鐘機(jī)制,每秒鐘執(zhí)行 大約60次左右
- CADisplayLink是一個(gè)計(jì)時(shí)器,可以使繪圖代碼與視圖的刷新頻率保 持同步,而NSTimer無法確保計(jì)時(shí)器實(shí)際被觸發(fā)的準(zhǔn)確時(shí)間
- 使用方法:
- 定義CADisplayLink并制定觸發(fā)調(diào)用方法
- 將顯示鏈接添加到主運(yùn)行循環(huán)隊(duì)列
下面是寫的一個(gè)關(guān)于CoreAnimation的一個(gè)demo
- 源碼地址 ：https://github.com/wjxlogo/CoreAnimation
- 這是效果
Untitled.gif
