生活随笔
收集整理的這篇文章主要介紹了
Android动画的实现 上
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
? ? ? ?在Android系統(tǒng)中也能經(jīng)常見到動(dòng)畫,那么如何實(shí)現(xiàn)動(dòng)畫效果呢?本文就來為大家介紹動(dòng)畫的實(shí)現(xiàn)方式。
???????Android中動(dòng)畫的實(shí)現(xiàn)分兩種方式,一種方式是補(bǔ)間動(dòng)畫Tween Animation,就是說你定義一個(gè)開始和結(jié)束,中間的部分由程序運(yùn)算得到。另一種叫逐幀動(dòng)畫Frame Animation,就是說一幀一幀的連起來播放就變成了動(dòng)畫。有點(diǎn)Flash基礎(chǔ)的同學(xué)理解起來會(huì)很容易。接下來我們一個(gè)一個(gè)學(xué)習(xí)。
???????一、補(bǔ)間動(dòng)畫Tween Animation
???????Android中實(shí)現(xiàn)補(bǔ)間動(dòng)畫的思路是這樣的,
???????1、首先用XML定義一個(gè)動(dòng)畫效果
???????2、依據(jù)這個(gè)XML使用AnimationUtils工具類創(chuàng)建一個(gè)Animationd對(duì)象
???????3、調(diào)用View組件的startAnimation方法實(shí)現(xiàn)動(dòng)畫。
?????? 接下來我們用一個(gè)例子來看一下。
?????? 1、創(chuàng)建一個(gè)項(xiàng)目Lesson24_Animation,主Activity名字叫MainActivity.java
?????? 2、在res目錄下創(chuàng)建一個(gè)anim目錄,在目錄下創(chuàng)建下面五個(gè)動(dòng)畫定義文件,需要注意的是這5個(gè)文件在是2.2下調(diào)試通過的,網(wǎng)上很多文檔的xml是無法通過IDE的檢查的,可能是新版本檢查更嚴(yán)格了。
?????? alpha_animation.xml
XML/HTML代碼
<?xml?version="1.0"?encoding="utf-8"?>?? ?????? composite_animation.xml
XML/HTML代碼
?? ???????rotate_animation.xml
XML/HTML代碼
<?xml?version="1.0"?encoding="utf-8"?>?? ???????scale_animation.xml
XML/HTML代碼
<?xml?version="1.0"?encoding="utf-8"?>?? ?????? translate_animation.xml
XML/HTML代碼
<?xml?version="1.0"?encoding="utf-8"?>?? ?????? 3、MainActivity.java的內(nèi)容如下:
Java代碼
package?android.basic.lesson24; ????import?android.app.Activity; ??import?android.os.Bundle; ??import?android.view.View; ??import?android.view.View.OnClickListener; ??import?android.view.animation.Animation; ??import?android.view.animation.AnimationUtils; ??import?android.widget.ImageButton; ????public?class?MainAnimation?extends?Activity?{ ??????????@Override??????public?void?onCreate(Bundle?savedInstanceState)?{ ??????????super.onCreate(savedInstanceState); ??????????setContentView(R.layout.main); ????????????????????final?ImageButton?ib1?=?(ImageButton)?findViewById(R.id.ImageButton01); ??????????final?ImageButton?ib2?=?(ImageButton)?findViewById(R.id.ImageButton02); ??????????final?ImageButton?ib3?=?(ImageButton)?findViewById(R.id.ImageButton03); ??????????final?ImageButton?ib4?=?(ImageButton)?findViewById(R.id.ImageButton04); ??????????final?ImageButton?ib5?=?(ImageButton)?findViewById(R.id.ImageButton05); ????????????????????OnClickListener?ocl?=?new?OnClickListener()?{ ????????????????@Override??????????????public?void?onClick(View?v)?{ ??????????????????switch?(v.getId())?{ ??????????????????case?R.id.ImageButton01: ??????????????????????????????????????????Animation?ani1?=?AnimationUtils.loadAnimation( ??????????????????????????????getApplicationContext(),?R.anim.alpha_animation); ??????????????????????????????????????????ib1.startAnimation(ani1); ??????????????????????break; ??????????????????case?R.id.ImageButton02: ??????????????????????Animation?ani2?=?AnimationUtils.loadAnimation( ??????????????????????????????getApplicationContext(),?R.anim.scale_animation); ??????????????????????ib2.startAnimation(ani2); ??????????????????????break; ??????????????????case?R.id.ImageButton03: ??????????????????????Animation?ani3?=?AnimationUtils.loadAnimation( ??????????????????????????????getApplicationContext(),?R.anim.translate_animation); ??????????????????????ib3.startAnimation(ani3); ??????????????????????break; ??????????????????case?R.id.ImageButton04: ??????????????????????Animation?ani4?=?AnimationUtils.loadAnimation( ??????????????????????????????getApplicationContext(),?R.anim.rotate_animation); ??????????????????????ib4.startAnimation(ani4); ??????????????????????break; ??????????????????case?R.id.ImageButton05: ??????????????????????Animation?ani5?=?AnimationUtils.loadAnimation( ??????????????????????????????getApplicationContext(),?R.anim.composite_animation); ??????????????????????ib5.startAnimation(ani5); ??????????????????????break; ??????????????????} ????????????????} ????????????}; ????????????????????ib1.setOnClickListener(ocl); ??????????ib2.setOnClickListener(ocl); ??????????ib3.setOnClickListener(ocl); ??????????ib4.setOnClickListener(ocl); ??????????ib5.setOnClickListener(ocl); ??????} ??}?? ?????? 4、運(yùn)行程序,查看結(jié)果。
?????? 原始圖:
?????? 點(diǎn)擊第一個(gè)按鈕的透明度變化效果:
?????? 點(diǎn)擊第二個(gè)按鈕的縮放效果,這里看到的是兩個(gè)縮放效果同時(shí)作用疊加的效果。也就是說默認(rèn)情況下效果是同時(shí)發(fā)生的,而不是先后執(zhí)行的,除非你使用 startoffset屬性指定。同學(xué)們看這一講最重要的還是自己練習(xí)來體會(huì)。
?????? 點(diǎn)擊第三個(gè)按鈕的位移效果,這個(gè)例子里我們可以清楚看到android:startOffset=”2000″的作用,數(shù)獨(dú)按鈕前2秒向右移了300像素,后2秒又回到原處,注意第二個(gè)translate中的負(fù)值參數(shù),它清晰的告訴我們位移數(shù)據(jù)是相對(duì)自身當(dāng)時(shí)位置的。
?????? 點(diǎn)擊第四個(gè)按鈕的旋轉(zhuǎn)效果,負(fù)的度數(shù)表示逆時(shí)針旋轉(zhuǎn)。
?????? 點(diǎn)擊第五個(gè)按鈕的復(fù)合動(dòng)畫效果,這個(gè)效果的代碼我是直接粘貼的官方幫助文檔里的代碼,看著效果還不賴^_^
???????二、逐幀動(dòng)畫
???????我們知道,Android是不支持Gif動(dòng)畫的,也不建議使用Gif動(dòng)畫,比較不幸的是到Android 2.2版本為止也不支持APNG這種png動(dòng)畫格式,所以我們制作只能用多張png圖片逐幀播放的方式來實(shí)現(xiàn)動(dòng)畫效果。下面我們用一個(gè)例子來學(xué)習(xí)一下逐幀動(dòng)畫。
?????? 1、新建一個(gè)項(xiàng)目Lesson24_FrameAnimation ,主Acitivy名字叫 MainFrameAnimation.java。
?????? 2、將下圖中的每個(gè)小圖片分開,即25張小圖片,拷貝到res/drawable目錄下。
???????3、在res/anim目錄下,新建一個(gè)文件 firefox_animation.xml 內(nèi)容如下:
XML/HTML代碼
<?xml?version="1.0"?encoding="utf-8"?>?? ?????? 4、在res/layout/main.xml中寫入如下內(nèi)容:
XML/HTML代碼
<?xml?version="1.0"?encoding="utf-8"?>??<BUTTON?type=submit>??</BUTTON>??<BUTTON?type=submit>??</BUTTON>?? ?????? 5、在MainFrameAnimation.javaz中的內(nèi)容如下:
Java代碼
package?android.basic.lesson24; ????import?android.app.Activity; ??import?android.graphics.drawable.AnimationDrawable; ??import?android.os.Bundle; ??import?android.view.View; ??import?android.view.View.OnClickListener; ??import?android.widget.Button; ??import?android.widget.ImageView; ????public?class?MainFrameAnimaton?extends?Activity?{ ??????????@Override??????public?void?onCreate(Bundle?savedInstanceState)?{ ??????????super.onCreate(savedInstanceState); ??????????setContentView(R.layout.main); ????????????????????Button?b1?=?(Button)?findViewById(R.id.Button01); ??????????Button?b2?=?(Button)?findViewById(R.id.Button02); ??????????final?ImageView?iv?=?(ImageView)?findViewById(R.id.ImageView01); ????????????????????OnClickListener?ocl?=?new?OnClickListener()?{ ????????????????@Override??????????????public?void?onClick(View?v)?{ ????????????????????????????????????AnimationDrawable?ad?=?(AnimationDrawable)?iv.getBackground(); ????????????????????switch?(v.getId())?{ ??????????????????case?R.id.Button01: ??????????????????????????????????????????ad.start(); ??????????????????????break; ??????????????????case?R.id.Button02: ??????????????????????????????????????????ad.stop(); ??????????????????????break; ??????????????????} ??????????????} ??????????}; ????????????????????b1.setOnClickListener(ocl); ??????????b2.setOnClickListener(ocl); ??????} ??}?? ????? ?6、運(yùn)行程序,查看效果:
?????? 換個(gè)背景再來一張,可以看到png動(dòng)畫的透明就是不一般^_^
?????? 順便提一下,我的這些可愛的小狐貍圖標(biāo),是在APNG這個(gè)項(xiàng)目中找到的,感興趣的朋友去搜搜APNG吧。
創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯,堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)
總結(jié)
以上是生活随笔為你收集整理的Android动画的实现 上的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。