Android-View Animation(檢視動畫)
阿新 • • 發佈:2019-01-17
Android系統提供了兩種動畫框架:property動畫(屬性動畫)和View動畫(檢視動畫)。這兩個動畫系統都是可行的方案,但在一般情況下,屬性動畫系統被優先使用,因為它更靈活,並且提供了更多的功能,除了兩個動畫系統之外,也可以利用Drawable動畫,它允許載入Drawable資源,一幀一幀的顯示這些Drawable資源。
這裡先學習View動畫,Android View Animamtion包括兩種:Tween和frame。
一、Tween動畫簡單介紹:
Tween動畫(補間動畫)根據一些資訊來計算動畫,如:起點(start point)、終點(end point)、尺寸(size)、旋轉(rotation)和動畫的其他共同點,可以在檢視物件的內容上進行一系列簡單的變換(位置、大小、旋轉、透明度)。比如,如果有一個TextView物件,就可以移動、旋轉、放大或者縮小它,如果它還有一張背景圖,背景圖則和它一起變換。
Tween動畫屬性通常定義在XML檔案中,其路徑:res/anim/filename.xml。如:
android:shareInterpolator:其值為布林型別。如果你想要在所有的子元素中共享同一個interpolator,其值為“true”。
2)<alpha>:淡入或淡出動畫。表示一個AlphaAnimation(類)。
<alpha>屬性引數:
android:fromAlpha:其值為Float型別,表示起點不透明度偏移,0.0表示透明,1.0表示不透明。
android:toAlpha:其值為Float型別,表示終點不透明度偏移,0.0表示透明,1.0表示不透明。
3)<scale>:表示一個伸縮動畫,可以通過指定pivotX和pivotY來指定image向外和向內伸縮的中心點。比如:pivotX和pivotY為0和0(左上角),這意味著所有的伸展將向下和向右。這個元素表示一個ScaleAnimation(類)。
<scale>屬性引數:
android:fromXScale:其值為Float型別,表示起點X軸偏移量,其值為1.0表示沒有任何變化。
android:toXScale:其值為Float型別,表示終點X軸偏移量,其值為1.0表示沒有任何變化。
android:fromYScale:其值為Float型別,表示起點Y軸偏移量,其值為1.0表示沒有任何變化。
android:toYScale:其值為Float型別,表示終點Y軸偏移量,其值為1.0表示沒有任何變化。
android:pivotX:其值為Float型別,表示,當物件縮放時,X座標保持固定。
android:pivotY:其值為Float型別,表示,當物件縮放時,Y座標保持固定。
4)<translate>:垂直和/或水平運動,支援一下任何三種格式:值的範圍從-100到100,並以“%”結束,表示相對於自身的百分比;值的範圍從-100到100,並以“%p“結束,表示相對於其父類屬性額百分比;值為沒有後綴的Float型別,表示一個TranslateAnimation(類)。
<translate>屬性引數:
android:fromXDelta:值為Float型別或者百分比。起點X軸的偏移量。要麼以畫素為單位表示相當於正常位置的值(如"5"),要麼以百分比為單位表示相對於該元素寬度的百分比值(如:5%),要麼以百分比為單位表示相對於父元素寬度的百分比值(如:“5%p”)。
android:toXDelta:值為Float型別或者百分比。終點X軸的偏移量。要麼以畫素為單位表示相當於正常位置的值(如"5"),要麼以百分比為單位表示相對於該元素寬度的百分比值(如:5%),要麼以百分比為單位表示相對於父元素寬度的百分比值(如:“5%p”)。 android:fromYDelta:值為Float型別或者百分比。起點Y軸的偏移量。要麼以畫素為單位表示相當於正常位置的值(如"5"),要麼以百分比為單位表示相對於該元素寬度的百分比值(如:5%),要麼以百分比為單位表示相對於父元素寬度的百分比值(如:“5%p”)。 android:toYDelta:值為Float型別或者百分比。終點Y軸的偏移量。要麼以畫素為單位表示相當於正常位置的值(如"5"),要麼以百分比為單位表示相對於該元素寬度的百分比值(如:5%),要麼以百分比為單位表示相對於父元素寬度的百分比值(如:“5%p”)。 5)<rotate>:一個旋轉動畫。表示一個RotateAnimation(類)。 <rotate>屬性引數: android:fromDegrees:值為Float型別,表示起點的角度位置,以度為單位。 android:toDegrees:值為Float型別,表示終點的角度位置,以度為單位。 android:pivotX:值為Float型別或者百分比,指示旋轉中心的X軸座標。要麼以畫素為單位表示相對於物件左邊緣的值(如:“5”),要麼以百分比為單位表示相對於物件左邊緣的值(如:“5%”),要麼以百分比為單位表示相對於其父容器元件的左邊緣的值(如“5%p”)。 android:pivotY:值為Float型別或者百分比,指示旋轉中心的Y軸座標。要麼以畫素為單位表示相對於物件頂邊的值(如:“5”),要麼以百分比為單位表示相對於物件頂邊的值(如:“5%”),要麼以百分比為單位表示相對於其父容器元件頂邊的值(如“5%p”)。 其他XML屬性引數:
interpolator說明:
interpolator是一個動畫調節器,定義在XML資原始檔中,影響動畫變化的速率。現有interpolator動畫效果有:accelerated(加速)、decelerated(減速)、repeated(反覆)、bounced(反彈)等。
如:
3)資源引用:@[package:]anim/filename 4)語法:
xml檔案必須有一個root元素,要麼是 <alpha>, <scale>, <translate>, <rotate>, 或者<set> 元素,該元素持有一組(或多組)其他動畫元素(甚至巢狀的<set>元素)。 各元素介紹: 1)<set>:一個持有其他動畫元素的容器,表示一個AnimationSet(一個類,可在原始碼中找到)。 <set>屬性引數: android:interpolator:interpolator(插值器)資源,一個Interpolator 應用在動畫上,它的值必須引用指向一個interpolator的資源(不是一個interpolator的類名)。在Android平臺上有預設的interpolator資源可用,或者建立自己的interpolator資源。<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@[package:]anim/interpolator_resource" android:shareInterpolator=["true" | "false"] > <alpha android:fromAlpha="float" android:toAlpha="float"/> <scale android:fromXScale="float" android:toXScale="float" android:fromYScale="float" android:toYScale="float" android:pivotX="float" android:pivotY="float"/> <translate android:fromXDelta="float" android:toXDelta="float" android:fromYDelta="float" android:toYDelta="float"/> <rotate android:fromDegrees="float" android:toDegrees="float" android:pivotX="float" android:pivotY="float"/> <set> ... </set> </set>
android:toXDelta:值為Float型別或者百分比。終點X軸的偏移量。要麼以畫素為單位表示相當於正常位置的值(如"5"),要麼以百分比為單位表示相對於該元素寬度的百分比值(如:5%),要麼以百分比為單位表示相對於父元素寬度的百分比值(如:“5%p”)。 android:fromYDelta:值為Float型別或者百分比。起點Y軸的偏移量。要麼以畫素為單位表示相當於正常位置的值(如"5"),要麼以百分比為單位表示相對於該元素寬度的百分比值(如:5%),要麼以百分比為單位表示相對於父元素寬度的百分比值(如:“5%p”)。 android:toYDelta:值為Float型別或者百分比。終點Y軸的偏移量。要麼以畫素為單位表示相當於正常位置的值(如"5"),要麼以百分比為單位表示相對於該元素寬度的百分比值(如:5%),要麼以百分比為單位表示相對於父元素寬度的百分比值(如:“5%p”)。 5)<rotate>:一個旋轉動畫。表示一個RotateAnimation(類)。 <rotate>屬性引數: android:fromDegrees:值為Float型別,表示起點的角度位置,以度為單位。 android:toDegrees:值為Float型別,表示終點的角度位置,以度為單位。 android:pivotX:值為Float型別或者百分比,指示旋轉中心的X軸座標。要麼以畫素為單位表示相對於物件左邊緣的值(如:“5”),要麼以百分比為單位表示相對於物件左邊緣的值(如:“5%”),要麼以百分比為單位表示相對於其父容器元件的左邊緣的值(如“5%p”)。 android:pivotY:值為Float型別或者百分比,指示旋轉中心的Y軸座標。要麼以畫素為單位表示相對於物件頂邊的值(如:“5”),要麼以百分比為單位表示相對於物件頂邊的值(如:“5%”),要麼以百分比為單位表示相對於其父容器元件頂邊的值(如“5%p”)。 其他XML屬性引數:
XML Attributes | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|
Attribute Name | Related Method | Description | |||||||||
android:detachWallpaper | setDetachWallpaper(boolean) | Window動畫的特殊選項,如果這個window在牆紙的上面,則不讓牆紙與它一起有動畫效果。 | |||||||||
android:duration | setDuration(long) | 動畫執行的時間(以毫秒為單位). | |||||||||
android:fillAfter | setFillAfter(boolean) | 如果設定為true,在動畫結束之後,動畫變換才被應用。 | |||||||||
android:fillBefore | setFillBefore(boolean) | 如果設定為true或者fillEnabled未設定為true,在動畫開始前,動畫變換被應用。 | |||||||||
android:fillEnabled | setFillEnabled(boolean) | 如果設定為true,fillBefore的值也被考慮在內。 | |||||||||
android:interpolator | setInterpolator(Interpolator) | 設定interpolator | |||||||||
android:repeatCount | setRepeatCount(int) | 定義動畫應該重複多少次。 | |||||||||
android:repeatMode | setRepeatMode(int) | Defines the animation behavior when it reaches the end and the repeat count is greater than 0 or infinite. | |||||||||
android:startOffset | setStartOffset(long) | Delay in milliseconds before the animation runs, once start time is reached. | |||||||||
android:zAdjustment | setZAdjustment(int) | Allows for an adjustment of the Z ordering of the content being animated for the duration of the animation. |
Interpolator class | Resource ID |
---|---|
AccelerateDecelerateInterpolator | @android:anim/accelerate_decelerate_interpolator |
AccelerateInterpolator | @android:anim/accelerate_interpolator |
AnticipateInterpolator | @android:anim/anticipate_interpolator |
AnticipateOvershootInterpolator | @android:anim/anticipate_overshoot_interpolator |
BounceInterpolator | @android:anim/bounce_interpolator |
CycleInterpolator | @android:anim/cycle_interpolator |
DecelerateInterpolator | @android:anim/decelerate_interpolator |
LinearInterpolator | @android:anim/linear_interpolator |
OvershootInterpolator | @android:anim/overshoot_interpolator |
<setandroid:interpolator="@android:anim/accelerate_interpolator">
...
</set>
自定義interpolators:
如果不滿意Android平臺提供的interpolators(如上表),可以通過修改屬性引數來自定義一個interpolator。例如:可以為AnticipateInterpolator調整加速度的速率,或為CycleInterpolator調整迴圈週期的數目。要做到這些,需要在XML中建立自己的interpolator資源。
1)xml檔案位置:res/anim/filename.xml。
2)編譯資源資料型別:資源指向對應的interpolator物件。3)資源引用:@[package:]anim/filename 4)語法:
<?xml version="1.0" encoding="utf-8"?>
<InterpolatorNamexmlns:android="http://schemas.android.com/apk/res/android"
android:attribute_name="value"
/>
如果在此xml資原始檔中,不修改任何引數,那麼這個interpolator就和它所指向的interpolator一樣。
5)元素:請注意每個Interpolator的實現,在XML中定義時,用小寫的名稱。
<accelerateDecelerateInterpolator>:開始和結束時的變化速率緩慢,但是中間卻會加速,無屬性引數。例如:
<set
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="5000"
android:startOffset="700"
/>
</set>
hyperspaceAnimation = AnimationUtils.loadAnimation(this, R.anim.macceleratedecelerateinterpolator);<accelerateInterpolator>:變換速率開始緩慢,然後加速。屬性引數:android:factor:值為Float型別,表示加速度(預設為1). 例如:
<set
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/accelerate_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="2000"
android:startOffset="700"
/>
</set>
<anticipateInterpolator>:變換開始先向後,然後向前。屬性引數:android:tension:表示提供的拉伸力度(預設為2),例如:
<set
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/anticipate_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="2000"
android:startOffset="700"
/>
</set>
<anticipateOvershootInterpolator>:變換開始向後,然後甩向前,然後渡過到目標值,最後穩定在最後的值。屬性引數:android:tension:表示提供的拉伸力度(預設為2)。例如:
<set
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/anticipate_overshoot_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="5000"
android:startOffset="700"
/>
</set>
<bounceInterpolator>:變換在結束時反彈。無屬性引數。例如:
<set<cycleInterpolator>:根據指定的迴圈數目重複動畫,變換速率遵循正弦模式。屬性引數:android:cycles:值為整型,表示迴圈的次數(預設為1)。 例如:
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/bounce_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="2000"
android:startOffset="700"
/>
</set>
<set
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/cycle_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="5000"
android:startOffset="700"
android:repeatCount="0"
/>
</set>
<linearInterpolator>:變換速率是恆定的,無屬性引數。例如:
<set
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/linear_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="5000"
android:startOffset="700"
/>
</set>
<overshootInterpolator>:變換甩向前,然後過渡到最後的值,然後返回。屬性引數:android:tension:表示提供的拉伸力度(預設為2)。如:
<set
android:shareInterpolator="false"
xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:interpolator="@android:anim/overshoot_interpolator"
android:fromXDelta="5"
android:toXDelta="50%p"
android:fromYDelta="5"
android:toYDelta="50%p"
android:duration="2000"
android:startOffset="700"
/>
</set>
hyperspaceAnimation = AnimationUtils.loadAnimation(this, R.anim.movershootinterpolator);
mImageView.startAnimation(hyperspaceAnimation);
二、Frame動畫(幀動畫):
1)資原始檔位置:res/drawable/filename.xml(filename將被用作此資源的ID)
2)編譯資源資料型別:資源指向AnimationDrawable。
3)語法:
<?xml version="1.0" encoding="utf-8"?>
<animation-listxmlns: