動(dòng)畫(huà) Core Animation

一說(shuō)到動(dòng)畫(huà)域醇,我們第一想到是哪個(gè)将鸵?

很多初學(xué)者應(yīng)該就是UIView動(dòng)畫(huà)误堡,UIView動(dòng)畫(huà)是蘋(píng)果給UIView加上的動(dòng)畫(huà)類(lèi)別界赔,使用起來(lái)相當(dāng)簡(jiǎn)單丢习,容易上手

  • (void)animateWithDuration:(NSTimeInterval)duration delay:(NSTimeInterval)delay usingSpringWithDamping:(CGFloat)dampingRatio initialSpringVelocity:(CGFloat)velocity options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^ __nullable)(BOOL finished))completion;
  • duration:動(dòng)畫(huà)時(shí)間
  • delay:延時(shí)執(zhí)行動(dòng)畫(huà)
  • dampingRatio:阻尼系數(shù)
  • velocity:速度
  • animations:動(dòng)畫(huà)執(zhí)行block
  • completion:動(dòng)畫(huà)結(jié)束回調(diào)block
通常UIView動(dòng)畫(huà)還可以配合CGAffineTransform實(shí)現(xiàn)平移、縮放淮悼、旋轉(zhuǎn)等動(dòng)畫(huà)
  • CGAffineTransformMakeTranslation
  • CGAffineTransformMakeScale
  • CGAffineTransformMakeRotation
當(dāng)然這個(gè)方法很大程度解決了一些基礎(chǔ)動(dòng)畫(huà)咐低,但是開(kāi)發(fā)中我們發(fā)現(xiàn)還是存在一些缺陷:

1.多組動(dòng)畫(huà)組的執(zhí)行實(shí)現(xiàn)起來(lái)很復(fù)雜
2.缺少對(duì)動(dòng)畫(huà)的暫停、速度變化袜腥、重復(fù)次數(shù)等的控制
3.實(shí)現(xiàn)炫酷(比如翻頁(yè)见擦,翻轉(zhuǎn)等)的動(dòng)畫(huà)基本不可能

今天我們就來(lái)學(xué)習(xí)一下CoreAnimation,以上的問(wèn)題都是可以解決

CoreAnimation核心動(dòng)畫(huà)直接作用在CALayer層瞧挤,簡(jiǎn)單介紹下layer的層次結(jié)構(gòu)Layer Tree

Model Tree :也就是我們通常所說(shuō)的layer锡宋。
Presentation Tree:呈現(xiàn)出來(lái)的layer,也就是我們做動(dòng)畫(huà)時(shí)你看到的那個(gè)layer特恬,可以通過(guò)layer.presentationLayer獲得执俩。
Render Tree :私有,無(wú)法訪問(wèn)癌刽。主要是對(duì)Presentation Tree數(shù)據(jù)進(jìn)行渲染役首,并且不會(huì)阻塞線程。

為什么方便介紹核心動(dòng)畫(huà)显拜,我們先把結(jié)構(gòu)圖展示出來(lái)

1498114752750475.png

CAAnimation

基礎(chǔ)動(dòng)畫(huà)衡奥,不能直接使用,
繼承于NSObject,協(xié)議<NSSecureCoding, NSCopying, CAMediaTiming, CAAction>

+(instancetype)animation //實(shí)例方法

  • timingFunction //動(dòng)畫(huà)節(jié)奏屬性
    kCAMediaTimingFunctionLinear 勻速
    kCAMediaTimingFunctionEaseIn 慢進(jìn)快出
    kCAMediaTimingFunctionEaseOut 快進(jìn)慢出
    kCAMediaTimingFunctionEaseInEaseOut 慢進(jìn)慢出远荠,中間加速
    kCAMediaTimingFunctionDefault 默認(rèn)

  • delegate //遵守CAAnimationDelegate協(xié)議
    -(void)animationDidStart:(CAAnimation *)anim; //動(dòng)畫(huà)開(kāi)始
    -(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag; //動(dòng)畫(huà)結(jié)束

  • removedOnCompletion //是否移除圖層顯示動(dòng)畫(huà)執(zhí)行后的狀態(tài)矮固,默認(rèn)為YES
    如果我們想顯示最后的動(dòng)畫(huà)狀態(tài),值設(shè)為NO譬淳,并且fillMode設(shè)置為kCAFillModeForwards

CAMediaTiming

動(dòng)畫(huà)協(xié)議档址,定義了動(dòng)畫(huà)的時(shí)間盹兢、速度、動(dòng)畫(huà)重復(fù)次數(shù)等

  • beginTime //設(shè)置動(dòng)畫(huà)延時(shí),若想延遲1秒守伸,就設(shè)置為CACurrentMediaTime()+1
    CACurrentMediaTime()為圖層動(dòng)畫(huà)當(dāng)前時(shí)間
  • duration //動(dòng)畫(huà)時(shí)間,真正的動(dòng)畫(huà)時(shí)間 = duration/speed
  • speed // 動(dòng)畫(huà)速率
  • timeOffset //動(dòng)畫(huà)時(shí)間偏移量绎秒。比如設(shè)置動(dòng)畫(huà)時(shí)長(zhǎng)為3秒,當(dāng)設(shè)置timeOffset為1.5時(shí)尼摹,動(dòng)畫(huà)會(huì)從后半段動(dòng)畫(huà)開(kāi)始
  • repeatCount //動(dòng)畫(huà)的重復(fù)次數(shù)
  • repeatDuration //動(dòng)畫(huà)的重復(fù)時(shí)間
  • autoreverses //動(dòng)畫(huà)自動(dòng)逆轉(zhuǎn)见芹。動(dòng)畫(huà)結(jié)束后會(huì)按照之前的軌跡回到動(dòng)畫(huà)開(kāi)始的位置
  • fillMode //決定當(dāng)前對(duì)象在非動(dòng)畫(huà)時(shí)間段的行為,比如動(dòng)畫(huà)開(kāi)始之前和動(dòng)畫(huà)結(jié)束
    kCAFillModeForwards 保持動(dòng)畫(huà)執(zhí)行后的狀態(tài)
    kCAFillModeBackwards 當(dāng)在動(dòng)畫(huà)開(kāi)始前,你只要把layer加入到一個(gè)動(dòng)畫(huà)中,layer便立即進(jìn)入動(dòng)畫(huà)的初始狀態(tài)并等待動(dòng)畫(huà)開(kāi)始
    kCAFillModeBoth 前兩個(gè)模型之和
    kCAFillModeRemoved 動(dòng)畫(huà)執(zhí)行完成后移除

CAPropertyAnimation

屬性動(dòng)畫(huà)蠢涝,通過(guò)屬性值改變動(dòng)畫(huà)效果竟稳,不可以直接使用

  • keyPath //CALayer的某個(gè)屬性名
  • additive //屬性動(dòng)畫(huà)是否以當(dāng)前動(dòng)畫(huà)效果為基礎(chǔ),默認(rèn)NO
  • cumulative // 指定動(dòng)畫(huà)是否為累加效果养距,默認(rèn)為NO
  • valueFunction //此屬性配合CALayer的transform屬性使用

+(instancetype)animationWithKeyPath:(nullable NSString *)path; //創(chuàng)建動(dòng)畫(huà)對(duì)象實(shí)例方法

CABasicAnimation

基礎(chǔ)動(dòng)畫(huà)修械,通過(guò)改變keypath的value(layer的屬性值)去執(zhí)行動(dòng)畫(huà)

  • fromValue //初始值
  • toValue //結(jié)束值
  • byValue //toValue = fromValue + byValue

CAKeyframeAnimation

關(guān)鍵幀動(dòng)畫(huà)仆潮,同樣通過(guò)keyPath對(duì)應(yīng)屬性進(jìn)行控制

  • values //動(dòng)畫(huà)組,動(dòng)畫(huà)會(huì)依次顯示其中的每一幀
  • path //關(guān)鍵幀路徑儿咱,動(dòng)畫(huà)進(jìn)行的要素庭砍,優(yōu)先級(jí)比values高,但是只對(duì)CALayer的+ anchorPoint和position起作用
  • keyTimes // 每一幀動(dòng)畫(huà)對(duì)應(yīng)的時(shí)間
  • timingFunctions //每一幀對(duì)應(yīng)的動(dòng)畫(huà)節(jié)奏
  • calculationMode //動(dòng)畫(huà)的計(jì)算模式
  • tensionValues //動(dòng)畫(huà)張力控制
  • continuityValues //動(dòng)畫(huà)連續(xù)性控制
  • biasValues //動(dòng)畫(huà)偏差率控制
  • rotationMode //動(dòng)畫(huà)沿路徑旋轉(zhuǎn)方式

CASpringAnimation

帶有物理系數(shù)的屬性動(dòng)畫(huà)

  • mass //小球質(zhì)量混埠,影響慣性
  • stiffness //彈簧的勁度系數(shù)
  • damping //阻尼系數(shù)怠缸,地面的摩擦力
  • initialVelocity //初始速度
  • settlingDuration //結(jié)算時(shí)間

CATransition

轉(zhuǎn)場(chǎng)動(dòng)畫(huà),提供需要3D動(dòng)畫(huà)

  • type //轉(zhuǎn)場(chǎng)動(dòng)畫(huà)類(lèi)型


    1498116888339802.png
  • subtype //轉(zhuǎn)場(chǎng)動(dòng)畫(huà)方向


    1498116905573479.png
  • startProgress //動(dòng)畫(huà)起點(diǎn)進(jìn)度(整體的百分比)

  • endProgress //動(dòng)畫(huà)終點(diǎn)進(jìn)度(整體的百分比)

  • filter //自定義轉(zhuǎn)場(chǎng)

CAAnimationGroup

動(dòng)畫(huà)組钳宪,統(tǒng)一控制管理多個(gè)動(dòng)畫(huà)

  • animations //所有動(dòng)畫(huà)效果元素的數(shù)組

更多炫酷的動(dòng)畫(huà)和demo:http://www.cocoachina.com/ios/20160712/17010.html

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末揭北,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子吏颖,更是在濱河造成了極大的恐慌搔体,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,406評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件半醉,死亡現(xiàn)場(chǎng)離奇詭異疚俱,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)缩多,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,395評(píng)論 3 398
  • 文/潘曉璐 我一進(jìn)店門(mén)呆奕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人衬吆,你說(shuō)我怎么就攤上這事梁钾。” “怎么了逊抡?”我有些...
    開(kāi)封第一講書(shū)人閱讀 167,815評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵姆泻,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我,道長(zhǎng)拇勃,這世上最難降的妖魔是什么蛾娶? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 59,537評(píng)論 1 296
  • 正文 為了忘掉前任,我火速辦了婚禮潜秋,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘胎许。我一直安慰自己峻呛,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,536評(píng)論 6 397
  • 文/花漫 我一把揭開(kāi)白布辜窑。 她就那樣靜靜地躺著钩述,像睡著了一般。 火紅的嫁衣襯著肌膚如雪穆碎。 梳的紋絲不亂的頭發(fā)上牙勘,一...
    開(kāi)封第一講書(shū)人閱讀 52,184評(píng)論 1 308
  • 那天,我揣著相機(jī)與錄音所禀,去河邊找鬼方面。 笑死,一個(gè)胖子當(dāng)著我的面吹牛色徘,可吹牛的內(nèi)容都是我干的恭金。 我是一名探鬼主播,決...
    沈念sama閱讀 40,776評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼褂策,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼横腿!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起斤寂,我...
    開(kāi)封第一講書(shū)人閱讀 39,668評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤耿焊,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后遍搞,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體罗侯,經(jīng)...
    沈念sama閱讀 46,212評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,299評(píng)論 3 340
  • 正文 我和宋清朗相戀三年尾抑,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了歇父。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,438評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡再愈,死狀恐怖榜苫,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情翎冲,我是刑警寧澤垂睬,帶...
    沈念sama閱讀 36,128評(píng)論 5 349
  • 正文 年R本政府宣布,位于F島的核電站,受9級(jí)特大地震影響驹饺,放射性物質(zhì)發(fā)生泄漏钳枕。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,807評(píng)論 3 333
  • 文/蒙蒙 一赏壹、第九天 我趴在偏房一處隱蔽的房頂上張望鱼炒。 院中可真熱鬧,春花似錦蝌借、人聲如沸昔瞧。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,279評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)自晰。三九已至,卻和暖如春稍坯,著一層夾襖步出監(jiān)牢的瞬間酬荞,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,395評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工瞧哟, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留混巧,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,827評(píng)論 3 376
  • 正文 我出身青樓绢涡,卻偏偏與公主長(zhǎng)得像牲剃,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子雄可,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,446評(píng)論 2 359