iOS核心動畫

一、關于核心動畫的介紹

1、核心動畫作用于layer層, layer有兩個屬性Position和achroPoint:

positon決定在父類圖層中的位置

achorPoint ?決定圖層的哪個點在position屬性指定的位置

2、核心動畫有:基本動畫、關鍵幀動畫, 動畫組, 轉場動畫;

核心動畫執行過程都是在后臺操作的, 不會阻塞主線程。

3、核心動畫的繼承結構:

3.1、CAAnimation

CAAnimation是所有動畫對象的父類,負責控制動畫的持續時間和速度,是個抽象類,不能直接使用,應該使用它具體的子類

屬性說明:(引用部分代表來自CAMediaTiming協議的屬性)

duration:動畫的持續時間

repeatCount:重復次數,無限循環可以設置HUGE_VALF或者MAXFLOAT

repeatDuration:重復時間

removedOnCompletion:默認為YES,代表動畫執行完畢后就從圖層上移除,圖形會恢復到動畫執行前的狀態。如果想讓圖層保持顯示動畫執行后的狀態,那就設置為NO,不過還要設置fillMode為kCAFillModeForwards

fillMode:決定當前對象在非active時間段的行為。比如動畫開始之前或者動畫結束之后

beginTime:可以用來設置動畫延遲執行時間,若想延遲2s,就設置為CACurrentMediaTime()+2,CACurrentMediaTime()為圖層的當前時間

timingFunction:速度控制函數,控制動畫運行的節奏

delegate:動畫代理

3.1.1 CAAnimation——動畫填充模式

fillMode屬性值(要想fillMode有效,最好設置removedOnCompletion=NO)

kCAFillModeRemoved這個是默認值,也就是說當動畫開始前和動畫結束后,動畫對layer都沒有影響,動畫結束后,layer會恢復到之前的狀態

kCAFillModeForwards當動畫結束后,layer會一直保持著動畫最后的狀態

kCAFillModeBackwards在動畫開始前,只需要將動畫加入了一個layer,layer便立即進入動畫的初始狀態并等待動畫開始。

kCAFillModeBoth這個其實就是上面兩個的合成.動畫加入后開始之前,layer便處于動畫初始狀態,動畫結束后layer保持動畫最后的狀態


3.1.2 CAAnimation——速度控制函數

速度控制函數(CAMediaTimingFunction)

1.kCAMediaTimingFunctionLinear(線性):勻速,給你一個相對靜態的感覺

2.kCAMediaTimingFunctionEaseIn(漸進):動畫緩慢進入,然后加速離開

3.kCAMediaTimingFunctionEaseOut(漸出):動畫全速進入,然后減速的到達目的地

4.kCAMediaTimingFunctionEaseInEaseOut(漸進漸出):動畫緩慢的進入,中間加速,然后減速的到達目的地。這個是默認的動畫行為。

3.1.3 CAAnimation -動畫代理方法

CAAnimation在分類中定義了代理方法

@interface ?NSObject(CAAnimationDelegate)

-(void)animationDidStart:(CAAnimation*)anim;

-(void)animationDidStop:(CAAnimation*)aim finished:(BOOL)flag;

@end

3.1.4、CALayer上動畫的暫停和恢復

#pragma mark 暫停CALayer的動畫

-(void)pauseLayer:(CALayer*)layer

{

CFTimeInterval pausedTime= [layer ?convertTime:CACurrentMediaTime() fromLayer:nil];

//讓CALayer的時間停止走動

layer.speed=0.0;

//讓CALayer的時間停留在pausedTime這個時刻

layer.timeOffset=pausedTime;

}

3.1.5 CALayer上動畫的恢復

#pragma mark 恢復CALayer的動畫

-(void)resumeLayer:(CALayer*)layer

{

CFTimeInterval pausedTime=layer.timeOffset;

//1.讓CALayer的時間繼續行走

layer.speed=1.0;

//2.取消上次記錄的停留時刻

layer.timeOffset=0.0;

//3.取消上次設置的時間

layer.beginTime=0.0;

//4.計算暫停的時間(這里也可以用CACurrentMediaTime()-pausedTime)

CFTimeInterval timeSincePause= [layer convertTime:CACurrentMediaTime() fromLayer:nil] - pausedTime;

//5.設置相對于父坐標系的開始時間(往后退timeSincePause)

layer.beginTime=timeSincePause;

}

3.2 CAProprertyAnimation


CAProprertyAnimation是CAAnimation的子類,也是個抽象類,要想創建動畫對象,應該使用它的兩個子類:

CABasicAnimation

CAKeyframeAnimation

屬性說明:

keyPath:通過指定CALayer的一個屬性名稱為keyPath(NSString類型),并且對CALayer的這個屬性的值進行修改,達到相應的動畫效果。比如,指定@“position”為keyPath,就修改CALayer的position屬性的值,以達到平移的動畫效果

3.2.1 CABasicAnimation——基本動畫

基本動畫,是CAPropertyAnimation的子類

屬性說明:

nfromValue:keyPath相應屬性的初始值

ntoValue:keyPath相應屬性的結束值

動畫過程說明:

隨著動畫的進行,在長度為duration的持續時間內,keyPath相應屬性的值從fromValue漸漸地變為toValue

keyPath內容是CALayer的可動畫Animatable屬性

如果fillMode=kCAFillModeForwards同時removedOnComletion=NO,那么在動畫執行完畢后,圖層會保持顯示動畫執行后的狀態。但在實質上,圖層的屬性值還是動畫執行前的初始值,并沒有真正被改變。

3.2.2 CAKeyframeAnimation——關鍵幀動畫

關鍵幀動畫,也是CAPropertyAnimation的子類,與CABasicAnimation的區別是:

CABasicAnimation只能從一個數值(fromValue)變到另一個數值(toValue),而CAKeyframeAnimation會使用一個NSArray保存這些數值

屬性說明:

values:上述的NSArray對象。里面的元素稱為“關鍵幀”(keyframe)。動畫對象會在指定的時間(duration)內,依次顯示values數組中的每一個關鍵幀

path:可以設置一個CGPathRef、CGMutablePathRef,讓圖層按照路徑軌跡移動。path只對CALayer的anchorPoint和position起作用。如果設置了path,那么values將被忽略

keyTimes:可以為對應的關鍵幀指定對應的時間點,其取值范圍為0到1.0,keyTimes中的每一個時間值都對應values中的每一幀。如果沒有設置keyTimes,各個關鍵幀的時間是平分的

CABasicAnimation可看做是只有2個關鍵幀的CAKeyframeAnimation

3.3 CAAnimationGroup——動畫組

動畫組,是CAAnimation的子類,可以保存一組動畫對象,將CAAnimationGroup對象加入層后,組中所有動畫對象可以同時并發運行

屬性說明:

animations:用來保存一組動畫對象的NSArray

默認情況下,一組動畫對象是同時運行的,也可以通過設置動畫對象的beginTime屬性來更改動畫的開始時間

3.4 CATransition——轉場動畫

CATransition是CAAnimation的子類,用于做轉場動畫,能夠為層提供移出屏幕和移入屏幕的動畫效果。iOS比Mac OS X的轉場動畫效果少一點

UINavigationController就是通過CATransition實現了將控制器的視圖推入屏幕的動畫效果

動畫屬性:

type:動畫過渡類型

subtype:動畫過渡方向

startProgress:動畫起點(在整體動畫的百分比)

endProgress:動畫終點(在整體動畫的百分比)


3.5、CADisplayLink

CADisplayLink是一種以屏幕刷新頻率觸發的時鐘機制,每秒鐘執行大約60次左右

CADisplayLink是一個計時器,可以使繪圖代碼與視圖的刷新頻率保持同步,而NSTimer無法確保計時器實際被觸發的準確時間

使用方法:

定義CADisplayLink并制定觸發調用方法

將顯示鏈接添加到主運行循環隊列

CADisplayLink *link? = [CADisplayLink displayLinkWithTarget:self selector:@selector(update)];

[link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];


二、核心動畫開發步驟

1. ?首先有CALayer

2. 初始化一個CAAnimation對象, 并設置一些懂動畫相關屬性

3. 通過調用CALayer的addAnimation:forKey方法,增加CAAnimation對象到CALayer中, 這樣就能開始執行動畫了。

4. 通過調用CAlayer的removeAnimationForkey方法, 可以停止CALayer中的動畫

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,001評論 6 537
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,786評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,986評論 0 381
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,204評論 1 315
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,964評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,354評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,410評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,554評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,106評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,918評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,093評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,648評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,342評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,755評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,009評論 1 289
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,839評論 3 395
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,107評論 2 375

推薦閱讀更多精彩內容

  • 在iOS中隨處都可以看到絢麗的動畫效果,實現這些動畫的過程并不復雜,今天將帶大家一窺ios動畫全貌。在這里你可以看...
    每天刷兩次牙閱讀 8,544評論 6 30
  • 在iOS中隨處都可以看到絢麗的動畫效果,實現這些動畫的過程并不復雜,今天將帶大家一窺iOS動畫全貌。在這里你可以看...
    F麥子閱讀 5,133評論 5 13
  • Core Animation Core Animation,中文翻譯為核心動畫,它是一組非常強大的動畫處理API,...
    45b645c5912e閱讀 3,047評論 0 21
  • 傳送門:《iOS核心動畫高級技巧》部分源碼 CA利用RunLoop收集圖層 Animatable屬性 的修改(如b...
    SvenLearn閱讀 1,726評論 3 44
  • 本文將分為四個部分介紹核心動畫: 第一部分將介紹核心動畫的基本概念。 第二部分將介紹動畫實現原理。 第三部分將介紹...
    曲年閱讀 3,207評論 1 9