關於動畫的實現,Android提供瞭Animation,在Android SDK介紹瞭2種Animation模式:
1. Tween Animation:通過對場景裡的對象不斷做圖像變換(平移、縮放、旋轉)產生動畫效果,即是一種漸變動畫;
2. Frame Animation:順序播放事先做好的圖像,是一種畫面轉換動畫。
動畫類型
下面先來看看Android提供的動畫類型。Android的animation由四種類型組成
在XML文件中:
alpha 漸變透明度動畫效果
scale 漸變尺寸伸縮動畫效果
translate 畫面轉換位置移動動畫效果
rotate 畫面轉移旋轉動畫效果
在Java 源碼中定義瞭相應的類,可以使用這些類的方法來獲取和操作相應的屬性:
AlphaAnimation漸變透明度動畫效果
ScaleAnimation漸變尺寸伸縮動畫效果
TranslateAnimation畫面轉換位置移動動畫效果
RotateAnimation畫面轉移旋轉動畫效果
Tween Animation
一個tween動畫將對視圖對象中的內容進行一系列簡單的轉換(位置,大小,旋轉,透明性)。如果你有一個文本視圖對象,你可以移動它,旋轉它,讓它變大或讓它變小,如果文字下面還有背景圖像,背景圖像也會隨著文件進行轉換。
使用XML來定義Tween Animation
動畫的XML文件在工程中res/anim目錄,這個文件必須包含一個根元素,可以使<alpha><scale> <translate> <rotate>插值元素或者是把上面的元素都放入<set>元素組中,默認情況下,所以的動畫指令都是同時發生的,為瞭讓他們按序列發生,需要設置一個特殊的屬性startOffset。動畫的指令定義瞭你想要發生什麼樣的轉換,當他們發生瞭,應該執行多長時間,轉換可以是連續的也可以使同時的。例如,你讓文本內容從左邊移動到右邊,然後旋轉180度,或者在移動的過程中同時旋轉,沒個轉換需要設置一些特殊的參數(開始和結束的大小尺寸的大小變化,開始和結束的旋轉角度等等,也可以設置些基本的參數(例如,開始時間與周期),如果讓幾個轉換同時發生,可以給它們設置相同的開始時間,如果按序列的話,計算開始時間加上其周期。
Tween Animation共同的節點屬性
屬性[類型] |
功能 |
備註 |
Duration[long] |
屬性為動畫持續時間 |
時間以毫秒為單位 |
fillAfter [boolean] |
當設置為true ,該動畫轉化在動畫結束後被應用 |
|
fillBefore[boolean] |
當設置為true ,該動畫轉化在動畫開始前被應用 |
|
interpolator |
指定一個動畫的插入器 |
有一些常見的插入器 |
repeatCount[int] |
動畫的重復次數 |
|
RepeatMode[int] |
定義重復的行為 |
1:重新開始 2:plays backward |
startOffset[long] |
動畫之間的時間間隔,從上次動畫停多少時間開始執行下個動畫 |
|
zAdjustment[int] |
定義動畫的Z Order的改變 |
0:保持Z Order不變 |
表二 |
||
XML節點 |
功能說明 |
|
alpha |
漸變透明度動畫效果 |
|
<alpha |
||
fromAlpha |
屬性為動畫起始時透明度 |
0.0表示完全透明 duration為動畫持續時間,ms單位 |
toAlpha |
屬性為動畫結束時透明度 |
表三 |
|||
scale |
漸變尺寸伸縮動畫效果 |
||
<scale |
|||
fromXScale[float] fromYScale[float] |
為動畫起始時,X、Y坐標上的伸縮尺寸 |
0.0表示收縮到沒有 |
|
toXScale [float] |
為動畫結束時,X、Y坐標上的伸縮尺寸 |
||
pivotX[float] |
為動畫相對於物件的X、Y坐標的開始位置 |
屬性值說明:從0%-100%中取值,50%為物件的X或Y方向坐標上的中點位置 |
|
|
|
|
|
表四 |
|||
translate |
畫面轉換位置移動動畫效果 |
||
<translate |
|||
fromXDelta |
為動畫、結束起始時X坐標上的位置 |
|
|
fromYDelta |
為動畫、結束起始時Y坐標上的位置 |
|
|
|
|
|
|
表五 |
|||
rotate |
畫面轉移旋轉動畫效果 |
||
<rotate |
|||
fromDegrees |
為動畫起始時物件的角度 |
說明 |
|
toDegrees |
屬性為動畫結束時物件旋轉的角度 可以大於360度 |
||
pivotX |
為動畫相對於物件的X、Y坐標的開始位 |
說明:以上兩個屬性值 從0%-100%中取值 |
|
下面給出一個完整的XML定義(SDK提供)
<setandroid:shareInterpolator="false"xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXScale="1.0"
android:toXScale="1.4"
android:fromYScale="1.0"
android:toYScale="0.6"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="false"
android:duration="700"/>
<setandroid:interpolator="@android:anim/decelerate_interpolator">
<scale
android:fromXScale="1.4"
android:toXScale="0.0"
android:fromYScale="0.6"
android:toYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="700"
android:duration="400"
android:fillBefore="false"/>
<rotate
android:fromDegrees="0"
android:toDegrees="-45"
android:toYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="700"
android:duration="400"/>
</set>
</set>
Tween Animation如何使用
使用AnimationUtils類的靜態方法loadAnimation()來加載XML中的動畫XML文件
//main.xml中的ImageView
ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);
//加載動畫
Animation hyperspaceJumpAnimation =AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
//使用ImageView顯示動畫
spaceshipImage.startAnimation(hyperspaceJumpAnimation);
如何在Java代碼中定義動畫
//在代碼中定義動畫實例對象
privateAnimation myAnimation_Alpha;
privateAnimation myAnimation_Scale;
privateAnimation myAnimation_Translate;
privateAnimation myAnimation_Rotate;
//根據各自的構造方法來初始化一個實例對象
myAnimation_Alpha=newAlphaAnimation(0.1f, 1.0f);
myAnimation_Scale =newScaleAnimation(0.0f, 1.4f, 0.0f, 1.4f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
myAnimation_Translate=newTranslateAnimation(30.0f, -80.0f, 30.0f, 300.0f);
myAnimation_Rotate=newRotateAnimation(0.0f, +350.0f,
Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF, 0.5f);
interpolator的解釋
interpolator定義一個動畫的變化率(the rate of change)。這使得基本的動畫效果(alpha, scale, translate, rotate)得以加速,減速,重復等。
AccelerateDecelerateInterpolator |
在動畫開始與介紹的地方速率改變比較慢,在中間的時候加速 |
AccelerateInterpolator |
在動畫開始的地方速率改變比較慢,然後開始加速 |
CycleInterpolator |
動畫循環播放特定的次數,速率改變沿著正弦曲線 |
DecelerateInterpolator |
在動畫開始的地方速率改變比較慢,然後開始減速 |
LinearInterpolator |
在動畫的以均勻的速率改變 |
XML屬性 |
說明 |
drawable |
當前幀引用的drawable資源 |
duration |
當前幀顯示的時間(毫秒為單位) |
oneshot |
如果為true,表示動畫隻播放一次停止在最後一幀上,如果設置為false表示動畫循環播放。 |
variablePadding |
If true, allows the drawable’s padding to change based on the current state that is selected. |
visible |
規定drawable的初始可見性,默認為flase; |
AnimationDrawable |
|
獲取、設置動畫的屬性 |
|
int getDuration() |
獲取動畫的時長 |
int getNumberOfFrames() |
獲取動畫的幀數 |
boolean isOneShot()
Void setOneShot(boolean oneshot) |
獲取oneshot屬性 |
void inflate(Resurce r,XmlPullParser p, |
|
增加、獲取幀動畫 |
|
Drawable getFrame(int index) |
獲取某幀的Drawable資源 |
void addFrame(Drawable frame,int duration) |
為當前動畫增加幀(資源,持續時長) |
動畫控制 |
|
void start() |
開始動畫 |
void run() |
外界不能直接掉調用,使用start()替代 |
boolean isRunning() |
當前動畫是否在運行 |
void stop() |
停止當前動畫 |
本文參考:Android SDK
moandroid.com
eoeandroid.com
下面就給個具體的XML例子,來定義一幀一幀的動畫:
<animation-listxmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true"> <itemandroid:drawable="@drawable/rocket_thrust1"android:duration="200"/> <itemandroid:drawable="@drawable/rocket_thrust2"android:duration="200"/> <itemandroid:drawable="@drawable/rocket_thrust3"android:duration="200"/> </animation-list>
上面的XML就定義瞭一個Frame Animation,其包含3幀動畫,3幀動畫中分別應用瞭drawable中的3張圖片:rocket_thrust1,rocket_thrust2,rocket_thrust3,每幀動畫持續200毫秒。
然後我們將以上XML保存在res/anim/文件夾下,命名為rocket_thrust.xml,顯示動畫的代碼:
AnimationDrawablerocketAnimation; publicvoidonCreate(BundlesavedInstanceState){ super.onCreate(savedInstanceState); setContentView(R.layout.main); ImageViewrocketImage =(ImageView)findViewById(R.id.rocket_image); rocketImage.setBackgroundResource(R.anim.rocket_thrust); rocketAnimation =(AnimationDrawable)rocketImage.getBackground(); } publicbooleanonTouchEvent(MotionEventevent){ if(event.getAction()==MotionEvent.ACTION_DOWN){ rocketAnimation.start(); returntrue; } returnsuper.onTouchEvent(event); }
代碼運行的結果:3張圖片按照順序的播放一次.
有一點需要強調的是:啟動Frame Animation動畫的代碼rocketAnimation.start();不能在OnCreate()中,因為在OnCreate()中AnimationDrawable還沒有完全的與ImageView綁定,在OnCreate()中啟動動畫,就隻能看到第一張圖片。這裡實在拖曳事件中實現的。