QuartzCore和CoreAnimation

相關資源

GitHub粒子發(fā)射和復制圖層示例
GitHub粘性控件示例
GitHub彈性動畫
CALayer分析
響應者手勢分析
CAEmitter分析

QuartzCore 簡介

本文檔集合提供了核心動畫的API參考。核心動畫為應用程序提供動畫和顯示層次結構功能朝刊。有關詳細信息唐全,請參見 Core Animation Programming Guide

QuartzCore主要結構

  1. CoreAnimation
  2. CADisplayLink定時器
  3. CALayer 及其子類(參考上方鏈接)
  4. CAMediaTiming協議相關
  5. CATransaction事物相關
  6. CATransform3D

可以看出所有的類和協議都以CA開頭,所以可以把此框架認為就是核心動畫框架

CoreAnimation簡介

CoreAnimation在APP中的結構.png

核心動畫本身并不是繪圖系統。它是一個在硬件層面合成和操縱您的應用程序的內容的基礎設施。在此基礎設施的核心是CALayer對象犹菱,層用于管理和操作內容。一個圖層捕獲你的內容到一個位圖中吮炕,位圖可以很容易地被圖形硬件使用腊脱。在大多數應用中,層是用來管理View內容的龙亲,但也可以根據需要創(chuàng)建獨立獨立的層使用陕凹。

CoreAnimation基本使用思路
CoreAnimation1.png

其實還有一個孫子類CASpringAnimation,它繼承自CABasicAnimation鳄炉,是用來做彈性動畫的杜耙。其實很多動畫UIKit中也有相關的API(包括彈性動畫),至于使用哪一種動畫:

  1. UIView動畫與核心動畫的區(qū)別?
  • 核心動畫只作用在layer.
  • 核心動畫修改的值都是假像.它的真實位置沒有發(fā)生變化拂盯,不會改變layer的frame泥技、transform屬性.
  1. 什么時候用UIView動畫什么時候用核心動畫?
  • 當需要與用戶進行交互時用UIView,不需要與用戶進行交互時兩個都可以。
  1. 什么情況用核心動畫最多?
  • 轉場動畫(UIView的轉場動畫類型比較少).
  • 幀動畫.
  • 動畫組.

CAAnimation使用

所有的核心動畫形式都定義在這個CAAnimation.h頭文件中

開發(fā)步驟:
  1. 首先得有CALayer(因為CoreAnimation是作用在CALayer上的
  2. 初始化一個CAAnimation對象磕仅,并設置一些動畫相關屬性
  3. 通過調用CALayer的addAnimation:forKey:方法珊豹,增加CAAnimation對象到CALayer中,這樣就能開始執(zhí)行動畫了
  4. 通過調用CALayer的removeAnimationForKey:方法可以停止CALayer中的動畫
CAMediaTiming協議

簡介:這個協議對于核心動畫很重要榕订。它提供對動畫節(jié)奏時間的控制的API店茶。 Layers and Animations都遵守并實現了協議方法。這個協議建立了分層的定時系統定時系統劫恒,每個對象描述的時間值都是映射自其parent贩幻。
Tip:animation的parent是groupAnimation,再往上是UILayer两嘴,再往上是layer.superLayer丛楚。下面會舉例一個屬性分析。

CAMediaTiming屬性

/* 動畫開始的時間憔辫,所有類型對象的該值都是0趣些,它好像是一個相對值:舉例:假如layer.beginTime = 1,圖層上的動畫animation.beginTime = CACurrentMediaTime() + 2 贰您,那么這個動畫被加入之后就會延遲1+2=3秒鐘開始執(zhí)行*/
@property CFTimeInterval beginTime;

/* Specifies the basic duration of the animation, in seconds. */
@property CFTimeInterval duration;

/* 運動速度坏平,如果該值是2锦亦,那么該動畫的速度將會是parent類的2倍 默認值是 1*/
@property float speed;

/*timeOffset和beginTime類似,但是和增加beginTime導致的延遲動畫不同杠园,增加timeOffset只是讓動畫快進到某一點顾瞪,例如,對于一個持續(xù)1秒的動畫來說惕橙,設置timeOffset為0.5意味著動畫將從一半的地方開始。默認值0 */
@property CFTimeInterval timeOffset;

/* The repeat count of the object. May be fractional. Defaults to 0. */
@property float repeatCount;

/* The repeat duration of the object. Defaults to 0. */
@property CFTimeInterval repeatDuration;

/* 反向執(zhí)行動畫. Defaults to NO. */
@property BOOL autoreverses;

/* 動畫執(zhí)行完事之后孵延,應該怎么處理亲配,如下選項
CA_EXTERN NSString * const kCAFillModeForwards
    CA_AVAILABLE_STARTING (10.5, 2.0, 9.0, 2.0);
CA_EXTERN NSString * const kCAFillModeBackwards
    CA_AVAILABLE_STARTING (10.5, 2.0, 9.0, 2.0);
CA_EXTERN NSString * const kCAFillModeBoth
    CA_AVAILABLE_STARTING (10.5, 2.0, 9.0, 2.0);
CA_EXTERN NSString * const kCAFillModeRemoved
    CA_AVAILABLE_STARTING (10.5, 2.0, 9.0, 2.0);
 Defaults to 'removed'. */
@property(copy) NSString *fillMode;

CACurrentMediaTime()
Returns the current CoreAnimation absolute time.
這個確實不好理解,不過我們可以通過測試總結:

  1. 他從動畫產生被添加到Layer上記錄一個時間a;
  2. 如果動畫是被beginTime 延遲了2秒吼虎,但是它的值是a+=2;
  3. 如果動畫被暫停了3(speed = 0),a還是會按系統時鐘走下去a+=3;
    所以CACurrentMediaTime()這個時間非常關鍵
CALayer上動畫的暫停和恢復
- (void)pauseLayer {
    CALayer *layer = self.redView.layer;
    CFTimeInterval pausedTime = [layer convertTime:CACurrentMediaTime() fromLayer:nil];
    // 讓CALayer的時間停止走動
    layer.speed = 0.0;
    // 讓CALayer的時間停留在pausedTime這個時刻
    layer.timeOffset = pausedTime;
}

- (void)resumeLayer {
    CALayer *layer = self.redView.layer;
    CFTimeInterval pausedTime = layer.timeOffset;
    // 1. 讓CALayer的時間繼續(xù)行走
    layer.speed = 1.0;
    // 2. 取消上次記錄的停留時刻
    layer.timeOffset = 0.0;
    // 3. 計算暫停的時間(這里也可以用CACurrentMediaTime()-pausedTime)
    CFTimeInterval timeSincePause = [layer convertTime:CACurrentMediaTime() fromLayer:nil] - pausedTime;
    // 4. 設置相對于父坐標系的開始時間(往后退timeSincePause)
    NSLog(@"Resume---- %f",timeSincePause);
    layer.beginTime += timeSincePause;
}
CAAnimation

是所有核心動畫對象的父類

/* 動畫節(jié)奏控制思灰,默認線性動畫 */
@property(nullable, strong) CAMediaTimingFunction *timingFunction;

/* 動畫執(zhí)行過程代理 */
@property(nullable, strong) id <CAAnimationDelegate> delegate;

/*動畫執(zhí)行完畢是否從Layer上移除,默認YES洒疚;如果不想移除動畫最終狀態(tài)歹颓,那就設置為NO,不過還要設置fillMode為kCAFillModeForwards
 */
@property(getter=isRemovedOnCompletion) BOOL removedOnCompletion;

// CAAnimationDelegate方法(可選)
/* Called when the animation begins its active duration. */
- (void)animationDidStart:(CAAnimation *)anim;
/* 當動畫完成了它的執(zhí)行時間或者被移除了油湖,這個方法會被調用. 'flag'is true if the animation reached the end of its active duration
 without being removed. */
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag;
CAPropertyAnimation

CAAnimation的子類巍扛,也是個抽象類,要想創(chuàng)建動畫對象乏德,應該使用它的兩個子類:CABasicAnimation和CAKeyframeAnimation

/* 通過指定CALayer的一個屬性名稱為keyPath(NSString類型)撤奸,并且對CALayer的這個屬性的值進行修改,達到相應的動畫效果喊括。比如胧瓜,指定@“position”為keyPath,就修改CALayer的position屬性的值郑什,以達到平移的動畫效果 */
@property(nullable, copy) NSString *keyPath;
CABasicAnimation
// keyPath相應屬性的初始值
@property(nullable, strong) id fromValue;
// keyPath相應屬性的結束值
@property(nullable, strong) id toValue;
/ /keyPath相應屬性的過渡值
@property(nullable, strong) id byValue;
CAKeyframeAnimation

關鍵幀動畫府喳,也是CAPropertyAnimation的子類,與CABasicAnimation的區(qū)別是:CAKeyframeAnimation對keyPath可以使用多值蘑拯,而且支持路線Path

// 里面的元素稱為“關鍵幀”(keyframe)劫拢。動畫對象會在指定的時間(duration)內,依次顯示values數組中的每一個關鍵幀强胰。
@property(nullable, copy) NSArray *values;

/* 可選屬性舱沧,定義了動畫功能的行為,非空值就會覆蓋Values屬性*/
@property(nullable) CGPathRef path;

/* 可選偶洋,定義了動畫的節(jié)奏(NSNumber類型)熟吏。每個值對應values里的每一個值,取值[0,1]。比如:values中有三個值牵寺,keyTimes = @[@0.2,@0.5,@0.8]悍引,則在duration*0.2開始從value0執(zhí)行動畫,在duration*0.9到value2并等待uration*0.1時間之后結束動畫 */
@property(nullable, copy) NSArray<NSNumber *> *keyTimes;

// 對應values帽氓,加入values有n個keyframes趣斤,那么就需要n-1個timingFunctions,它描述keyframe到keyframe的時間節(jié)奏黎休。
@property(nullable, copy) NSArray<CAMediaTimingFunction *> *timingFunctions;
CASpringAnimation

彈性動畫浓领,繼承CABasicAnimation

/* 附在彈簧末端的物體的質量。必須大于0势腮,默認值是1. */
@property CGFloat mass;

/* 彈簧剛度系數联贩。必須大于0, Defaults to 100. */
@property CGFloat stiffness;

/* 阻尼系數捎拯, 必須大于或者等于0泪幌,Defaults to 10. */
@property CGFloat damping;

/* 附在彈簧上的物體的初速度,默認值0署照,代表沒有移動祸泪;負值表示網固定點反方向運動,正值反之 */
@property CGFloat initialVelocity;

/* 返回彈簧系統在靜止時所需的估計時間建芙。 時間是在當前系數下預估的浴滴。 */
@property(readonly) CFTimeInterval settlingDuration;
CAAnimationGroup

動畫組升略,動畫組,是CAAnimation的子類品嚣,可以保存一組動畫對象,將CAAnimationGroup對象加入層后翰撑,組中所有動畫對象可以同時并發(fā)運行啊央,屬性beginTime剛才也提到了,具有累加的效果瓜饥。

CATransition

轉場動畫,CATransition是CAAnimation的子類乓土,用于做轉場動畫溯警。UINavigationController就是通過CATransition實現了將控制器的視圖推入屏幕的動畫效果狡相。

/* 轉場動畫類型,Defaults to `fade'. */
@property(copy) NSString *type;

/* 轉場動畫子類型 */
@property(nullable, copy) NSString *subtype;

/* The amount of progress through to the transition at which to begin and end execution. Legal values are numbers in the range [0,1]喳挑。endProgress(默認值1)值必須要大于startProgress(默認值0)。*/
@property float startProgress;
@property float endProgress;

/* 執(zhí)行過度的可選過濾器伊诵,一旦設置`type' and `subtype'設置被忽略. The filter must implement `inputImage', `inputTargetImage' and `inputTime' input keys, and the `outputImage' output key. Optionally it may support the `inputExtent' key, which will be set to a rectangle describing the region in which the transition should run. Defaults to nil. */
@property(nullable, strong) id filter;
TransitionType.png
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末日戈,一起剝皮案震驚了整個濱河市询张,隨后出現的幾起案子,更是在濱河造成了極大的恐慌份氧,老刑警劉巖,帶你破解...
    沈念sama閱讀 216,651評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件恋拷,死亡現場離奇詭異厅缺,居然都是意外死亡,警方通過查閱死者的電腦和手機湘捎,發(fā)現死者居然都...
    沈念sama閱讀 92,468評論 3 392
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來窥妇,“玉大人,你說我怎么就攤上這事烹骨。” “怎么了沮焕?”我有些...
    開封第一講書人閱讀 162,931評論 0 353
  • 文/不壞的土叔 我叫張陵拉宗,是天一觀的道長。 經常有香客問我,道長络它,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,218評論 1 292
  • 正文 為了忘掉前任化戳,我火速辦了婚禮埋凯,結果婚禮上,老公的妹妹穿的比我還像新娘白对。我一直安慰自己,他們只是感情好甩恼,可當我...
    茶點故事閱讀 67,234評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著悦污,像睡著了一般。 火紅的嫁衣襯著肌膚如雪切端。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,198評論 1 299
  • 那天踏枣,我揣著相機與錄音钙蒙,去河邊找鬼。 笑死仪搔,一個胖子當著我的面吹牛,可吹牛的內容都是我干的烤咧。 我是一名探鬼主播,決...
    沈念sama閱讀 40,084評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼煮嫌,長吁一口氣:“原來是場噩夢啊……” “哼笛谦!你這毒婦竟也來了昌阿?” 一聲冷哼從身側響起恳邀,我...
    開封第一講書人閱讀 38,926評論 0 274
  • 序言:老撾萬榮一對情侶失蹤灶轰,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后笋颤,有當地人在樹林里發(fā)現了一具尸體,經...
    沈念sama閱讀 45,341評論 1 311
  • 正文 獨居荒郊野嶺守林人離奇死亡赋除,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,563評論 2 333
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現自己被綠了非凌。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,731評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡颁糟,死狀恐怖,靈堂內的尸體忽然破棺而出滚停,到底是詐尸還是另有隱情沃粗,我是刑警寧澤,帶...
    沈念sama閱讀 35,430評論 5 343
  • 正文 年R本政府宣布最盅,位于F島的核電站,受9級特大地震影響涡贱,放射性物質發(fā)生泄漏。R本人自食惡果不足惜问词,卻給世界環(huán)境...
    茶點故事閱讀 41,036評論 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望辰狡。 院中可真熱鬧,春花似錦宛篇、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,676評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽吆倦。三九已至听诸,卻和暖如春蛇更,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背赛糟。 一陣腳步聲響...
    開封第一講書人閱讀 32,829評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留掌逛,地道東北人。 一個月前我還...
    沈念sama閱讀 47,743評論 2 368
  • 正文 我出身青樓豆混,卻偏偏與公主長得像动知,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子盒粮,可洞房花燭夜當晚...
    茶點故事閱讀 44,629評論 2 354

推薦閱讀更多精彩內容