動(dòng)畫(huà)類(lèi)型

核心動(dòng)畫(huà)提供了一系列在應(yīng)用中可以使用的動(dòng)畫(huà)垦写。

動(dòng)畫(huà)類(lèi)型

  • CAAnimation 是所有動(dòng)畫(huà)的一個(gè)基類(lèi)坪哄。CAAnimation遵守?fù)碛袆?dòng)畫(huà)持續(xù)時(shí)長(zhǎng)担映、速度以及重復(fù)次數(shù)的CAMediaTiming協(xié)議持痰。CAAnimation也遵守了CAAction協(xié)議修陡,該協(xié)議可以響應(yīng)由layer層的拖拽所產(chǎn)生的彈簧動(dòng)畫(huà)效果朽缴。CAAnimation將動(dòng)畫(huà)的節(jié)奏定義為CAMediaTimingFunction實(shí)例對(duì)象善玫。這個(gè)節(jié)奏就是以貝塞爾曲線的方式描述動(dòng)畫(huà)的執(zhí)行節(jié)奏,線性就表示該動(dòng)畫(huà)在持續(xù)時(shí)間內(nèi)的執(zhí)行速度是勻速的密强,而ease-in也就是說(shuō)這個(gè)動(dòng)畫(huà)在一開(kāi)始進(jìn)來(lái)的時(shí)候是緩慢的茅郎,但是越到末尾的時(shí)候速度就會(huì)越來(lái)越快。
  • CAPropertyAnimation是一個(gè)繼承自CAAnimation的一個(gè)基類(lèi)或渤,可以通過(guò)key path的訪問(wèn)來(lái)對(duì)layer層的屬性執(zhí)行動(dòng)畫(huà)效果系冗。
  • CABasicAnimation繼承自CAPropertyAnimation的可以為layer屬性提供簡(jiǎn)單的插入的動(dòng)畫(huà)。
  • CAKeyframeAnimation也是繼承自CAPropertyAnimation薪鹦,可以執(zhí)行key frame的動(dòng)畫(huà)效果掌敬。通過(guò)定義layer層屬性動(dòng)畫(huà)的key path 以及動(dòng)畫(huà)在每個(gè)階段的不同值,以及動(dòng)畫(huà)的執(zhí)行次數(shù)和動(dòng)畫(huà)節(jié)奏池磁。在動(dòng)畫(huà)執(zhí)行的過(guò)程中奔害,就會(huì)將所設(shè)置的動(dòng)畫(huà)屬性值插入到動(dòng)畫(huà)里。
  • CATransition是一個(gè)影響全部?jī)?nèi)容的一個(gè)轉(zhuǎn)場(chǎng)動(dòng)畫(huà)地熄,可以漸隱华临、push進(jìn)來(lái)以及在動(dòng)畫(huà)過(guò)程中reveal layer層內(nèi)容。
  • CAAnimationGroup可以同時(shí)執(zhí)行一組好幾個(gè)動(dòng)畫(huà)效果端考。

圖1 展示的是動(dòng)畫(huà)效果之間的層級(jí)關(guān)系并且總結(jié)了可用的動(dòng)畫(huà)屬性雅潭。

animation class map.png

圖1 核心動(dòng)畫(huà)類(lèi)以及協(xié)議

Timing,Timingspaces以及CAAnimation

動(dòng)畫(huà)的本質(zhì)就是描述一個(gè)屬性值隨著時(shí)間的變化揭厚。核心動(dòng)畫(huà)為動(dòng)畫(huà)和layer提供了基本的節(jié)奏函數(shù),有強(qiáng)大的性能寻馏。

Media Timing Protocol

核心動(dòng)畫(huà)通過(guò)CAMediaTiming協(xié)議來(lái)描述時(shí)間模型棋弥,而且被CAAnimation及其子類(lèi)所遵守核偿。時(shí)間模型明確了一個(gè)動(dòng)畫(huà)的持續(xù)時(shí)間诚欠、速度以及循環(huán)次數(shù)。
CAMediaTiming協(xié)議也被CALayer層所遵守漾岳,可以使層定義一個(gè)相對(duì)于父層的一個(gè)時(shí)空轰绵;
動(dòng)畫(huà)或者層的speed屬性表示這種縮放因子。例如尼荆,一個(gè)10秒的動(dòng)畫(huà)左腔,那么一個(gè)速度為2的layer則會(huì)花費(fèi)5秒的時(shí)間來(lái)執(zhí)行這個(gè)動(dòng)畫(huà)。如果這個(gè)層的子層也定義一個(gè)速度為2的因子捅儒,那么這個(gè)動(dòng)畫(huà)就會(huì)在原來(lái)的1/4的時(shí)間內(nèi)執(zhí)行完畢液样。
duration屬性表示一個(gè)動(dòng)畫(huà)單次執(zhí)行所需要的總時(shí)間(以秒為單位)。CAAnimation的默認(rèn)時(shí)間是0秒巧还,如果沒(méi)有定義時(shí)間的話鞭莽,那么動(dòng)畫(huà)持續(xù)時(shí)間就是0.25秒。
時(shí)間洗衣通過(guò)beginTimetimeOffset兩個(gè)屬性來(lái)開(kāi)始一個(gè)動(dòng)畫(huà)麸祷。beginTime表示在執(zhí)行動(dòng)畫(huà)的層所在時(shí)空的開(kāi)始時(shí)間澎怒,而timeOffset則是一個(gè)附加的offset,但是是以當(dāng)前時(shí)間為基準(zhǔn)的阶牍。兩個(gè)屬性相結(jié)合來(lái)表示動(dòng)畫(huà)開(kāi)始的時(shí)間喷面。

Repeatin Animations

CAMediaTiming協(xié)議用repeatCountrepeatDuration來(lái)表示一個(gè)動(dòng)畫(huà)重復(fù)執(zhí)行的次數(shù)。repeatCount屬性可以是極小的數(shù)字走孽,表示的是一個(gè)動(dòng)畫(huà)重復(fù)執(zhí)行的次數(shù)惧辈。將一個(gè)10秒動(dòng)畫(huà)的重復(fù)執(zhí)行次數(shù)repeatCount設(shè)置為2.5就表示這個(gè)動(dòng)畫(huà)將會(huì)執(zhí)行25秒,并且將會(huì)停在迭代到第三圈的一半的時(shí)候磕瓷。如果將該屬性設(shè)置為1e100f那么這個(gè)動(dòng)畫(huà)將會(huì)一直持續(xù)著咬像,直到將這個(gè)layer移除掉。
repeatDuration屬性與repeatCount屬性類(lèi)似生宛,雖然它是以秒為單位而不是以迭代周期為單位县昂。repeatDuration也可以是一個(gè)很小的數(shù)。
autoreverses屬性表示陷舅,在假設(shè)當(dāng)前動(dòng)畫(huà)可以執(zhí)行多次的情況下倒彰,當(dāng)正向執(zhí)行完畢后是否可以反向執(zhí)行動(dòng)畫(huà)。

Fill Mode

fillMode屬性表示一個(gè)動(dòng)畫(huà)在執(zhí)行之外是一個(gè)什么狀態(tài)莱睁。動(dòng)畫(huà)可以停在起始位置也可以是結(jié)束點(diǎn)位置或者是完全移除待讳。默認(rèn)行為是在動(dòng)畫(huà)執(zhí)行完畢之后移除動(dòng)畫(huà)效果芒澜。

Animation Pacing

動(dòng)畫(huà)的節(jié)奏也就是指那些插入的值如何在動(dòng)畫(huà)執(zhí)行期間展現(xiàn)出來(lái),使用恰當(dāng)合適的節(jié)奏可以加強(qiáng)用戶對(duì)該動(dòng)畫(huà)效果的印象创淡。
動(dòng)畫(huà)的節(jié)奏由以貝塞爾曲線所表示的時(shí)間函數(shù)來(lái)表達(dá)痴晦。
CAAnimation的時(shí)間函數(shù)屬性定義了一個(gè)CAMediaTimingFunction實(shí)例對(duì)象來(lái)概括時(shí)間函數(shù)。CAMediaTimingFunction可以定義一般的曲線以及由兩個(gè)控制點(diǎn)所形成的曲線琳彩。
常用的CAMediaTimingFunction有以下幾種:

  • kCAMediaTimingFunctionLinear表示動(dòng)畫(huà)勻速執(zhí)行誊酌。
  • kCAMediaTimingFunctionEaseIn表示動(dòng)畫(huà)開(kāi)始的時(shí)候執(zhí)行速度比較慢,但是越到后面執(zhí)行速度越快露乏。
  • kCAMediaTimingFunctionEaseOut表示動(dòng)畫(huà)開(kāi)始的執(zhí)行速度比較快碧浊,但是到后面的時(shí)候執(zhí)行速度就會(huì)越來(lái)越慢。
  • kCAMediaTimingFunctionEaseInEaseOut表示動(dòng)畫(huà)的執(zhí)行屬于兩頭比較慢瘟仿,但是中間執(zhí)行速度較快的那種箱锐。

圖2 表示的是動(dòng)畫(huà)執(zhí)行的貝塞爾曲線表示

function.png
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市劳较,隨后出現(xiàn)的幾起案子驹止,更是在濱河造成了極大的恐慌,老刑警劉巖观蜗,帶你破解...
    沈念sama閱讀 217,084評(píng)論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件臊恋,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡嫂便,警方通過(guò)查閱死者的電腦和手機(jī)捞镰,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,623評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)毙替,“玉大人岸售,你說(shuō)我怎么就攤上這事〕Щ” “怎么了凸丸?”我有些...
    開(kāi)封第一講書(shū)人閱讀 163,450評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)袱院。 經(jīng)常有香客問(wèn)我屎慢,道長(zhǎng),這世上最難降的妖魔是什么忽洛? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,322評(píng)論 1 293
  • 正文 為了忘掉前任腻惠,我火速辦了婚禮,結(jié)果婚禮上欲虚,老公的妹妹穿的比我還像新娘集灌。我一直安慰自己,他們只是感情好复哆,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,370評(píng)論 6 390
  • 文/花漫 我一把揭開(kāi)白布欣喧。 她就那樣靜靜地躺著腌零,像睡著了一般。 火紅的嫁衣襯著肌膚如雪唆阿。 梳的紋絲不亂的頭發(fā)上益涧,一...
    開(kāi)封第一講書(shū)人閱讀 51,274評(píng)論 1 300
  • 那天,我揣著相機(jī)與錄音驯鳖,去河邊找鬼闲询。 笑死,一個(gè)胖子當(dāng)著我的面吹牛臼隔,可吹牛的內(nèi)容都是我干的嘹裂。 我是一名探鬼主播妄壶,決...
    沈念sama閱讀 40,126評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼摔握,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了丁寄?” 一聲冷哼從身側(cè)響起氨淌,我...
    開(kāi)封第一講書(shū)人閱讀 38,980評(píng)論 0 275
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎伊磺,沒(méi)想到半個(gè)月后盛正,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,414評(píng)論 1 313
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡屑埋,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,599評(píng)論 3 334
  • 正文 我和宋清朗相戀三年豪筝,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片摘能。...
    茶點(diǎn)故事閱讀 39,773評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡续崖,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出团搞,到底是詐尸還是另有隱情严望,我是刑警寧澤,帶...
    沈念sama閱讀 35,470評(píng)論 5 344
  • 正文 年R本政府宣布逻恐,位于F島的核電站像吻,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏复隆。R本人自食惡果不足惜拨匆,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,080評(píng)論 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望挽拂。 院中可真熱鬧惭每,春花似錦、人聲如沸轻局。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,713評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至览爵,卻和暖如春置鼻,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背蜓竹。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,852評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工箕母, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人俱济。 一個(gè)月前我還...
    沈念sama閱讀 47,865評(píng)論 2 370
  • 正文 我出身青樓嘶是,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親蛛碌。 傳聞我的和親對(duì)象是個(gè)殘疾皇子聂喇,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,689評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容

  • 在iOS中隨處都可以看到絢麗的動(dòng)畫(huà)效果,實(shí)現(xiàn)這些動(dòng)畫(huà)的過(guò)程并不復(fù)雜蔚携,今天將帶大家一窺ios動(dòng)畫(huà)全貌希太。在這里你可以看...
    每天刷兩次牙閱讀 8,485評(píng)論 6 30
  • 在iOS中隨處都可以看到絢麗的動(dòng)畫(huà)效果,實(shí)現(xiàn)這些動(dòng)畫(huà)的過(guò)程并不復(fù)雜酝蜒,今天將帶大家一窺iOS動(dòng)畫(huà)全貌誊辉。在這里你可以看...
    F麥子閱讀 5,110評(píng)論 5 13
  • 在iOS實(shí)際開(kāi)發(fā)中常用的動(dòng)畫(huà)無(wú)非是以下四種:UIView動(dòng)畫(huà),核心動(dòng)畫(huà)亡脑,幀動(dòng)畫(huà)堕澄,自定義轉(zhuǎn)場(chǎng)動(dòng)畫(huà)。 1.UIView...
    請(qǐng)叫我周小帥閱讀 3,092評(píng)論 1 23
  • 動(dòng)畫(huà)類(lèi)型 隱式動(dòng)畫(huà) 之所以叫隱式是因?yàn)槲覀儾](méi)有指定任何動(dòng)畫(huà)的類(lèi)型霉咨。我們僅僅改變了一個(gè)屬性蛙紫,然后Core Anim...
    人生看淡不服就干閱讀 1,119評(píng)論 0 0
  • 書(shū)寫(xiě)的很好,翻譯的也棒躯护!感謝譯者惊来,感謝感謝! iOS-Core-Animation-Advanced-Techni...
    錢(qián)噓噓閱讀 2,297評(píng)論 0 6