2018-04-19—幀動(dòng)畫(huà)和補(bǔ)間動(dòng)畫(huà)使用

今天先給大家看一下效果哈哈:


幀動(dòng)畫(huà)效果
補(bǔ)間動(dòng)畫(huà)效果

這個(gè)就是我們今天要學(xué)習(xí)的東西蔚晨,第一個(gè)是幀動(dòng)畫(huà)板祝,第二個(gè)是補(bǔ)間動(dòng)畫(huà)绪妹。

幀動(dòng)畫(huà)這個(gè)名字大家應(yīng)該都比較熟悉甥桂,但是補(bǔ)間動(dòng)畫(huà)應(yīng)該就不太清楚了,沒(méi)關(guān)系邮旷,等會(huì)兒講到的時(shí)候我們?cè)俳o大家詳細(xì)介紹黄选,首先我們來(lái)看一下幀動(dòng)畫(huà):



一、幀動(dòng)畫(huà)

幀動(dòng)畫(huà)顧名思義婶肩,就是把一幀一幀的播放办陷,我們把幾張圖片放進(jìn)去,讓他依次展示出來(lái)狡孔,這個(gè)就是幀動(dòng)畫(huà)的效果了懂诗。接下啦我們來(lái)看一下如何實(shí)現(xiàn)的:

在實(shí)現(xiàn)功能之前蜂嗽,我們先做一下準(zhǔn)備工作苗膝,給activity.xml和activity.java文件進(jìn)行設(shè)置(為了了功能講解方便):

activity.xml文件


MainActivity.java文件設(shè)置

好了,接下啦我們進(jìn)入正題植旧,首先開(kāi)始幀動(dòng)畫(huà)功能實(shí)現(xiàn):

幀動(dòng)畫(huà)實(shí)現(xiàn)有兩種方法:java代碼實(shí)現(xiàn)和xml文件實(shí)現(xiàn)辱揭,我們先來(lái)看java代碼實(shí)現(xiàn):

1.java代碼實(shí)現(xiàn):

我們的思路是這樣的:首先創(chuàng)建幀布局對(duì)應(yīng)的類(lèi)(AnimationDrawable),然后進(jìn)行相關(guān)屬性添加病附,最后把它加入到img中问窃。


我們調(diào)用了addFrame方法來(lái)給ad添加圖片,第一個(gè)參數(shù)是我們圖片的id完沪,第二個(gè)參數(shù)duration是我們要讓他顯示多少毫秒域庇。

setOneShot是我們是否讓他只跑一次,我們選擇false覆积,讓他循環(huán)跑听皿。

最后我們?cè)邳c(diǎn)擊事件中調(diào)用了ad.start方法,然他動(dòng)起來(lái)宽档,現(xiàn)在我們來(lái)看一看效果吧:


幀動(dòng)畫(huà)效果

2.用.xml實(shí)現(xiàn):


我們?cè)赿rawable下創(chuàng)建了一個(gè)叫做frame_anim的xml文件尉姨,然后外標(biāo)簽寫(xiě)為animation-list,里面的item吗冤,drawable屬性添加圖片又厉,duration是顯示時(shí)間。


我們這次不new AnimationDrawable椎瘟,而是通過(guò)getDrawable獲取我們剛才創(chuàng)建的xml文件覆致。

效果就不展示了,跟java的一樣肺蔚。

這個(gè)很簡(jiǎn)答煌妈,大家應(yīng)該可以接受,下面我們來(lái)看一下補(bǔ)間動(dòng)畫(huà):


二、補(bǔ)間動(dòng)畫(huà)

首先說(shuō)一下補(bǔ)間動(dòng)畫(huà)是個(gè)什么意思声旺,我們的動(dòng)畫(huà)不可能只是有圖片的來(lái)回切換構(gòu)成動(dòng)畫(huà)笔链,我們同樣也可以通過(guò)對(duì)圖片進(jìn)行平移、旋轉(zhuǎn)腮猖、縮放鉴扫、透明度漸變等操作,來(lái)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的動(dòng)畫(huà)效果澈缺,下面我們一次來(lái)看一下這些效果實(shí)現(xiàn)坪创。

1.平移。

平移對(duì)應(yīng)的類(lèi)是TranslateAnimation姐赡。


TranslateAnimation類(lèi)構(gòu)造方法

我們注意到他有四個(gè)構(gòu)造方法莱预,我們一般常用的是最后兩個(gè),我們就看第三個(gè)吧:

它對(duì)應(yīng)的參數(shù)從左到右分別是:

? ? ? ? ? ? ? ? ? ? ? ? 動(dòng)畫(huà)x軸起始位置相對(duì)默認(rèn)位置偏移量项滑,動(dòng)畫(huà)x軸結(jié)束位置相對(duì)默認(rèn)位置偏移量依沮,

? ? ? ? ? ? ? ? ? ? ? ? 動(dòng)畫(huà)y軸起始位置相對(duì)默認(rèn)位置偏移量,動(dòng)畫(huà)y軸結(jié)束位置相對(duì)默認(rèn)位置偏移量枪狂。

我簡(jiǎn)單解釋一下危喉,大家都知道m(xù)argin吧,我們的x軸相對(duì)偏移就可以理解為marginStart州疾,二y軸相對(duì)偏移就可以理解為marginTop辜限,無(wú)論是起始還是結(jié)束位置都是這樣的。

現(xiàn)在我們來(lái)設(shè)置數(shù)值:


很明顯我們只讓它從默認(rèn)位置向右移動(dòng)的100严蓖,

別忘了點(diǎn)擊事件中啟動(dòng)薄嫡,我們通過(guò)ImageView的startAnimation方法來(lái)啟動(dòng)。


平移效果

2.縮放

還是同樣的圖片颗胡,我們來(lái)進(jìn)行縮放操作:

縮放對(duì)應(yīng)的類(lèi)是ScaleAnimation

ScaleAnimation類(lèi)

我們注意到它的構(gòu)造方法參數(shù)也是很多額毫深,我們只看最后一個(gè)。

它對(duì)應(yīng)的參數(shù)分別是:

????????????動(dòng)畫(huà)播放前x軸比例杭措,動(dòng)畫(huà)播放后x軸比例费什,

????????????動(dòng)畫(huà)播放前y軸比例,動(dòng)畫(huà)播放后y軸比例手素,

????????????x軸縮放軸點(diǎn)坐標(biāo)模式鸳址,x縮放軸點(diǎn)相對(duì)值,

????????????y軸縮放軸點(diǎn)坐標(biāo)模式泉懦,y軸縮放點(diǎn)相對(duì)值稿黍。

這里面的參數(shù)除了5和7參數(shù),其他的都是一個(gè)比例值崩哩,這么來(lái)說(shuō)吧巡球,我們?nèi)绻付?言沐,那他就是默認(rèn)位置的最左邊緣或者最上邊緣(看是x還是y了),如果我們指定0.5f酣栈,那就是默認(rèn)位置的一半長(zhǎng)度的位置险胰,如果指定1,那就是最右邊緣(或左下邊緣)矿筝,如果大于1也同樣能理解了起便,2就是默認(rèn)x(或y)長(zhǎng)度的2倍的位置。它相對(duì)的就是默認(rèn)的位置比例窖维。

我們來(lái)給他添加參數(shù):


我們?cè)O(shè)置的是從默認(rèn)位置的中心出發(fā)榆综,然后從0.5倍放大到1倍,這個(gè)TO_SELF屬性是我們相對(duì)自己铸史,他還有一個(gè)屬性是TO_PARENT——相對(duì)父布局鼻疮。

我們看一下效果:


縮放

3.旋轉(zhuǎn)

相信學(xué)完了平移和縮放之后,大家都知道這個(gè)補(bǔ)間動(dòng)畫(huà)是個(gè)什么意思了琳轿,而且一般是怎么操作了判沟,我們現(xiàn)在來(lái)看一下旋轉(zhuǎn)。

它對(duì)應(yīng)的類(lèi)是RotateAnimation:


RotateAnimation類(lèi)

我們發(fā)現(xiàn)這個(gè)參數(shù)也不少啊利赋,我們還是看這個(gè)最長(zhǎng)的水评,它對(duì)應(yīng)的參數(shù)分別是:

1.2.都是角度,用1減2就是旋轉(zhuǎn)的角度媚送,默認(rèn)順時(shí)針,值是正的就是順時(shí)針寇甸,負(fù)的就是逆時(shí)針塘偎。

3.x旋轉(zhuǎn)軸點(diǎn)類(lèi)型4.x軸點(diǎn)

5.y旋轉(zhuǎn)軸點(diǎn)類(lèi)型6.y軸點(diǎn)

這個(gè)4和6軸點(diǎn)跟縮放是一樣的,還是相對(duì)默認(rèn)位置的比例拿霉。

我們還是讓他旋轉(zhuǎn)點(diǎn)為默認(rèn)位置中心吟秩,然后逆時(shí)針旋轉(zhuǎn)90度,我們來(lái)看一下效果:


旋轉(zhuǎn)

4.透明度(漸變)

他對(duì)應(yīng)的類(lèi)是AlphaAnimation:


AlphaAnimation類(lèi)

他還是比較好弄的绽淘,構(gòu)造方法很簡(jiǎn)單涵防,我們看一下第二個(gè):

第一個(gè)是動(dòng)畫(huà)開(kāi)始前透明度,第二個(gè)是動(dòng)畫(huà)結(jié)束后透明度沪铭。這兩個(gè)參數(shù)都是從-1到1壮池,對(duì)應(yīng)完全透明到不透明。直接上代碼杀怠,+效果了:



關(guān)于Animation還有一些其他通用的方法:

setFillAfter(Boolean):視圖結(jié)束后保持結(jié)束位置椰憋,說(shuō)白了就是旋轉(zhuǎn)后還是轉(zhuǎn)后的位置,平移后還時(shí)平移后的位置赔退,縮放后還是縮放后的比例橙依。

setFillBefore(Boolean):同上正好相反证舟,如果這兩個(gè)方法都不操作,他默認(rèn)before的方法為true窗骑。

setRepeatCount(int):視圖重復(fù)次數(shù)女责,注意是重復(fù)次數(shù),不是變換次數(shù)创译。


三鲤竹、組合

上面我們學(xué)了補(bǔ)間動(dòng)畫(huà),他分別有平移昔榴、縮放辛藻、旋轉(zhuǎn)和漸變效果,我們同樣可以把他們組合起來(lái)互订,讓他們同時(shí)變換 吱肌,這里直接用.xml實(shí)現(xiàn)了(上面的四種同樣可以用.xml實(shí)現(xiàn)):

1.我們?cè)趓es目錄下創(chuàng)建名為anim的系統(tǒng)目錄,

2然后在里面創(chuàng)建.xml文件


anim目錄下的anim_set.xml文件

我們看到我們里面添加了兩個(gè)標(biāo)簽仰禽,分別是translate和alpha氮墨,這個(gè)大家應(yīng)該都能看懂了,是平移和漸變吐葵。里面的一些屬性跟我們剛才構(gòu)造方法中的一模一樣规揪,

注意我們?cè)趕et標(biāo)簽里添加的一些屬性,duration效果時(shí)間温峭,fillAfter保持結(jié)束視圖猛铅。


我們通過(guò)AnimationUtils的loadAnimation方法來(lái)獲取剛才的.xml文件。


這是平移加漸變的效果凤藏,至于一開(kāi)始的例子和其他的效果奸忽,大家自由組合吧哈哈(悄悄說(shuō)一下,白色方塊旋轉(zhuǎn)的那個(gè)補(bǔ)間動(dòng)畫(huà)揖庄,用到了handler哦)栗菜。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市蹄梢,隨后出現(xiàn)的幾起案子疙筹,更是在濱河造成了極大的恐慌,老刑警劉巖禁炒,帶你破解...
    沈念sama閱讀 219,110評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件而咆,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡齐苛,警方通過(guò)查閱死者的電腦和手機(jī)翘盖,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,443評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)凹蜂,“玉大人馍驯,你說(shuō)我怎么就攤上這事阁危。” “怎么了汰瘫?”我有些...
    開(kāi)封第一講書(shū)人閱讀 165,474評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵狂打,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我混弥,道長(zhǎng)趴乡,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,881評(píng)論 1 295
  • 正文 為了忘掉前任蝗拿,我火速辦了婚禮晾捏,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘哀托。我一直安慰自己惦辛,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,902評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布仓手。 她就那樣靜靜地躺著胖齐,像睡著了一般。 火紅的嫁衣襯著肌膚如雪嗽冒。 梳的紋絲不亂的頭發(fā)上呀伙,一...
    開(kāi)封第一講書(shū)人閱讀 51,698評(píng)論 1 305
  • 那天,我揣著相機(jī)與錄音添坊,去河邊找鬼剿另。 笑死,一個(gè)胖子當(dāng)著我的面吹牛帅腌,可吹牛的內(nèi)容都是我干的驰弄。 我是一名探鬼主播,決...
    沈念sama閱讀 40,418評(píng)論 3 419
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼速客,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了五鲫?” 一聲冷哼從身側(cè)響起溺职,我...
    開(kāi)封第一講書(shū)人閱讀 39,332評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎位喂,沒(méi)想到半個(gè)月后浪耘,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,796評(píng)論 1 316
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡塑崖,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,968評(píng)論 3 337
  • 正文 我和宋清朗相戀三年七冲,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片规婆。...
    茶點(diǎn)故事閱讀 40,110評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡澜躺,死狀恐怖蝉稳,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情掘鄙,我是刑警寧澤耘戚,帶...
    沈念sama閱讀 35,792評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站操漠,受9級(jí)特大地震影響收津,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜浊伙,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,455評(píng)論 3 331
  • 文/蒙蒙 一撞秋、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧嚣鄙,春花似錦吻贿、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,003評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至赵抢,卻和暖如春剧蹂,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背烦却。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,130評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工宠叼, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人其爵。 一個(gè)月前我還...
    沈念sama閱讀 48,348評(píng)論 3 373
  • 正文 我出身青樓冒冬,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親摩渺。 傳聞我的和親對(duì)象是個(gè)殘疾皇子简烤,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,047評(píng)論 2 355

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