iOS中CoreAnimation開發框架中Layer層動畫相關

? ? ?Copyright ? 2017年ZaneWangWang. All rights reserved.

CAAnimation動畫體系的介紹

如果你看到的不是原文請看原文CoreAnimation開發框架中Layer層動畫,想看應用實例請看我的另一篇文章iOS中Layer層CABasicAnimation和CAAnimationGroup應用

? ? ? ?CAAnimation是CoreAnimation框架中執行動畫對象的基類,從CAAnimation中集成出三個子類分別是用于創建屬性動畫的CAPropertyAnimation,創建轉場動畫的CATransition和創建組合動畫的CAAnimationGroup。

Layer層動畫類繼承關系

1.CAAnimation屬性和方法

a.CAAnimation作為動畫對象的基類,其中封裝了動畫的基礎屬性,如下:

?+ (instancetype)animation;//通過類方法創建一個CAAnimation對象

@property(nullable, strong) CAMediaTimingFunction *timingFunction;//動畫執行的時序模式

@property(nullable, strong) id delegate;//代理

@property(getter=isRemovedOnCompletion) BOOL removedOnCompletion;//是否動畫完成時將動畫對象移除掉

b.timingFunction定義了動畫執行的時序效果,CAMediaTimingFunction的創建方式如下:

+ (instancetype)functionWithName:(NSString *)name;

name參數決定的執行的效果,可選參數如下

NSString * const kCAMediaTimingFunctionLinear;//線性執行

NSString * const kCAMediaTimingFunctionEaseIn;//淡入? 在動畫開始時 淡入效果

NSString * const kCAMediaTimingFunctionEaseOut;//淡出 在動畫結束時 淡出效果

NSString * const kCAMediaTimingFunctionEaseInEaseOut;//淡入淡出

NSString * const kCAMediaTimingFunctionDefault;//默認效果

c.CAAnimation的代理方法入如下幾個:

- (void)animationDidStart:(CAAnimation *)anim;//動畫開始時執行的回調

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag;//動畫結束后執行的回調

2.CAPropertyAnimation屬性與方法

a.CAPropertyAnimation是繼承于CAAnimation專門用來創建與屬性相關的動畫的類:

+ (instancetype)animationWithKeyPath:(nullable NSString *)path;//創建對象 參數path就是執行動畫的屬性的字符串

例如:要修改透明度path就傳@"alpha";

@property(getter=isAdditive) BOOL additive;//動畫執行狀態是否疊加在控件原狀態上,默認為NO

@property(getter=isCumulative) BOOL cumulative;//對于重復動畫來說,默認為NO從起始狀態開始,YES表示在上一次執行基礎之上執行

@property(nullable, strong) CAValueFunction *valueFunction;//和transfron屬性的動畫執行相關,通過這個參數,可以幫助我們直接操作transfrom3D屬性變化產生動畫效果

例如:做一個z軸的旋轉動畫

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

animation.fromValue = @0;//從0度開始

animation.toValue = [NSNumber numberWithFloat:M_PI];//旋轉到180度

animation.duration = 2;//時間2S

animation.valueFunction = [CAValueFunction functionWithName:kCAValueFunctionRotateZ];//設置為z軸旋轉,實際上我們也可以不設置這個屬性,只需要在創建動畫對象的時候的path變為@"transform.rotation.z"也可以訪問到這個屬性

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

3.CABasicAnimation屬性

CABasicAnimaton是CAPropertyAnimation分出來的一個子類,創建基礎的屬性變化動畫,例如我們上面的示例代碼,其中屬性如下:

@property(nullable, strong) id fromValue;//對應屬性動畫開始值

@property(nullable, strong) id toValue;//對應屬性動畫結束值

@property(nullable, strong) id byValue;///和fromeValue配合對應屬性動畫開始值到fromValue+byValue,和toValue配合從toValue-byValue到toValue

具體確定動畫方案如下:

(1)fromValue和toValue不為空:動畫的值由fromValue變化到toValue

(2)fromValue和byValue不為空:動畫的值由fromValue變化到fromValue+byValue

(3)byValue和toValue不為空:動畫的值由toValue-byValue變化到toValue

(4)只有fromValue不為空:動畫的值由fromValue變化到layer的當前狀態值

(5)只有toValue不為空:動畫的值由layer當前的值變化到toValue

(6)只有byValue不為空:動畫的值由layer當前的值變化到layer當前的值+byValue

4.CAKeyframeAnimation關鍵幀動畫

CAKeyframeAnimation也是繼承與CAPropertyAnimation的一個子類,其與CABasicAnimation的不同之處在于雖然其都是改變layer層屬性的動畫,但是CABasicAnimation只能設置初始與結束狀態,這之間我們沒辦法控制,而CAKeyframeAnimation可以讓我們設置一些關鍵幀再整個動畫的過程中。屬性方法如下:

@property(nullable, copy) NSArray *values;//關鍵幀的值數組 例如我們想讓控件沿某個路徑移動,這里面存放每個移動的點

例如:

CAKeyframeAnimation * ani = [CAKeyframeAnimation animationWithKeyPath:@"position"];

ani.values = @[[NSValue valueWithCGPoint:CGPointMake(100, 100)],[NSValue valueWithCGPoint:CGPointMake(120, 100)],[NSValue valueWithCGPoint:CGPointMake(120, 200)],[NSValue valueWithCGPoint:CGPointMake(200, 200)]];

ani.duration = 3;

[layer addAnimation:ani forKey:@""];

@property(nullable) CGPathRef path;//直接設置路徑,作用域values類似

@property(nullable, copy) NSArray *keyTimes;//設置每一幀執行的時間長短 這個的取值為0-1,代表占用時間的比例

@property(nullable, copy) NSArray *timingFunctions;//每一幀的時序效果,詳見CAAnimation介紹b條

@property(copy) NSString *calculationMode;//設置幀的中間值如何計算

有以下幾種:

NSString * const kCAAnimationLinear;

NSString * const kCAAnimationDiscrete;

NSString * const kCAAnimationPaced;

NSString * const kCAAnimationCubic;

NSString * const kCAAnimationCubicPaced;

5.CATransition轉場動畫

CATransition和CAPropertyAnimation的不同之處在于當layer層出現時,會產生動畫效果,而并不是屬性改變時,屬性如下:

@property(copy) NSString *type;//設置動畫類型

動畫類型有:

NSString * const kCATransitionFade;//淡入

NSString * const kCATransitionMoveIn;//移入

NSString * const kCATransitionPush;//壓入

NSString * const kCATransitionReveal;//溶解

@property(nullable, copy) NSString *subtype;//設置動畫的方向

動畫方向有:

NSString * const kCATransitionFromRight;//從右側進

NSString * const kCATransitionFromLeft;//從左側進

NSString * const kCATransitionFromTop;//從上側進

NSString * const kCATransitionFromBottom;//從下側進

其實,關于type定義的動畫效果,出來官方定義的,我們還可以使用一些私有的參數,如下:

(1)pageCurl?? 翻頁

(2)rippleEffect 滴水效果

(3)suckEffect 收縮效果,如一塊布被抽走

(4)cube 立方體效果

(5)oglFlip 上下翻轉效果

例如:

CATransition * ani = [CATransition animation];

ani.type =? @"pageCurl";

ani.subtype = kCATransitionFromRight;

[layer addAnimation:ani forKey:@""];

6.CAAnimationGroup動畫組

CAAnimationGroup本身并沒有定義動畫,他可以將我們上面提到的相關動畫進行組合:

@property(nullable, copy) NSArray *animations;//動畫組

高級動畫技巧

1.事務類

CoreAnimation中還有一個非常重要的類:CATransaction事物類,這個可以同時設置多個layer層的動畫效果。可以通過隱式和顯式兩種方式來進行動畫操作。

2.CATransaction屬性

對layer層的屬性操作,都會形成隱式動畫,要使用隱式動畫,需要關閉layer層的animation動畫屬性,使用下面的方法:

+ (BOOL)disableActions;//關閉animation動畫效果,開啟隱式動畫

+ (void)setDisableActions:(BOOL)flag;

CATransaction用類方式通過設置key-value來進行動畫的屬性設置:

+ (nullable id)valueForKey:(NSString *)key;

+ (void)setValue:(nullable id)anObject forKey:(NSString *)key;

支持的key值如下:


NSString * const kCATransactionAnimationDuration;//設置動畫持續時間

NSString * const kCATransactionDisableActions;//設置停用animation類動畫

NSString * const kCATransactionAnimationTimingFunction;//設置動畫時序效果

NSString * const kCATransactionCompletionBlock;//設置動畫完成后的回調

除了隱式的展示動畫外,也可以顯式的通過調用CATransaction的相關方法進行顯示的提交動畫:

+ (void)begin;//動畫開始

+ (void)commit;//提交動畫

+ (void)flush;//立即進行動畫渲染 一般不需調用

下面這兩個方法用于動畫事物的加鎖與解鎖 在多線程動畫中,保證修改屬性的安全

+ (void)lock;

+ (void)unlock;

本文借鑒腳本之家大神博文

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

推薦閱讀更多精彩內容