最常用的動畫系統——補間動畫

1.前言

隨著技術的發展，移動端開發也多種多樣起來，有Native、Hybrid和Web等多種開發方式。而Native開發出來最早，並且一直處於主流位置，其中就有一個原因是，介面互動豐富，動畫過渡流暢。

2.動畫的種類

既然要學習安卓動畫，自然上官網看最權威了。由下面的截圖可知，動畫分為三類，分別與屬性、檢視和圖片相關。而屬性動畫是安卓3.0版本後引入的，也是官方推薦使用的。

Animation.png

通過搜尋animation可以找到動畫的所有資源，我們先關注非屬性相關動畫。

search.png

通過對android.view.animation包的介紹，可以知道，安卓在最開始就提供了兩種簡單的動畫系統。

• 補間動畫，可以對檢視及其內容進行位置、大小、旋轉角度和透明度等視覺上變換，但檢視的實際位置、大小、旋轉角度和透明度等不變。
• 幀動畫，通過載入一系列的圖片資源，進行動畫的播放，與AnimationDrawable類有關，屬於圖形繪製的範疇。

simple animations.png

3.補間動畫

對於補間動畫，知道以下四個類或者介面，就可以滿足大部分使用情況了。

• Animation，是其它動畫類的基類，宣告適用於Views，Surfaces等物件。
• AnimationSet，是Animation的子類，表示一組一起播放的動畫。
• Interpolator，控制動畫播放中的效果，系統提供了常用的幾個值。
• AnimationUtils，提供包括載入動畫資原始檔等功能的工具類。

android.view.animation.png

4.具體使用

播放動畫的物件通過setAnimation(Animation)或者startAnimation(Animation)的方法繫結或者啟動動畫，所以構建Animation例項就是原生動畫最核心的部分。Animation例項有兩種方法建立：

• 新建Animation的子類物件，例如AlphaAnimation, TranslateAnimation, RotateAnimation, ScaleAnimation, AnimationSet等。
• 通過AnimationUtils.loadAnimation(Context context, int resId) 的方法載入XML的配置檔案，生成動畫物件。檔案放在res/anim資料夾下，通過R.anim.XXX來引用。

我們先看看，Animation共有的屬性有哪些，以及程式碼中如何設定：

android:duration
動畫執行的總時長，毫秒為單位。
程式碼表示：setDuration(long)

android:fillAfter
當為true時，動畫保持在最後狀態。預設值是false。
當fillEnabled不為true，且動畫未繫結檢視時，預設為true。
程式碼表示：setFillAfter(boolean)

android:fillBefore
當為true或者fillEnabled不為true時，動畫恢復到最開始狀態。預設值是true。
程式碼表示：setFillBefore(boolean)

android:fillEnabled
當為true，fillBefore為true的結果相同。
程式碼表示：setFillEnabled(boolean)

android:interpolator
定義一個插值器使動畫過渡更加平滑，可以被動畫集合共用。
程式碼表示：setInterpolator(Interpolator)

android:repeatCount
定義動畫被重複執行的次數。預設值是0。
程式碼表示：setRepeatCount(int)

android:repeatMode
當repeatCount>0，且動畫執行到了終值時，進行的重複行為的型別。
restart是預設值，表示從頭開始。reverse，表示反向開始。
程式碼表示：setRepeatMode(int)

android:startOffset
動畫開始執行前延遲的毫秒數。
程式碼表示：setStartOffset(long)

android:zAdjustment
設定動畫執行時，檢視內容在Z軸上的層級。
normal是預設值，表示維持當前層級。top，表示移到最上層。bottom，表示移到最底層。
程式碼表示：setZAdjustment(int)

看完了公共屬性，再分別說明各自特有的屬性。

// alpha標籤
android:fromAlpha 動畫開始的透明度，在0.0~1.0之間，0.0表示完全透明，1.0表示完全不透明。
android:toAlpha 動畫結束的透明度，取值範圍與fromAlpha一樣。
程式碼表示：
AlphaAnimation(Context context, AttributeSet attrs) 
通過構造方法載入屬性資源生成AlphaAnimation物件。
AlphaAnimation(float fromAlpha, float toAlpha) 
通過構造方法注入的引數生成AlphaAnimation物件，與alpha標籤屬性一一對應。

// translate標籤
android:fromXDelta 動畫開始的位置與控制元件左上角的橫向距離。型別可以為數值（畫素為單位），百分數（距離佔自己寬度的百分比）和百分數p（距離佔父控制元件寬度的百分比）。
android:toXDelta 動畫結束的位置與控制元件左上角的橫向距離，取值範圍與fromXDelta一樣。
android:fromYDelta 動畫開始的位置與控制元件左上角的縱向距離，取值範圍與fromXDelta一樣。
android:toYDelta 動畫結束的位置與控制元件左上角的縱向距離，取值範圍與fromXDelta一樣。
程式碼表示：
TranslateAnimation(Context context, AttributeSet attrs) 
通過構造方法載入屬性資源生成TranslateAnimation物件。
TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta) 
通過構造方法注入的引數生成TranslateAnimation物件，預設與控制元件左上角的距離單位是畫素。
TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue) 
基於上面構造方法，與控制元件左上角的距離單位為Animation.ABSOLUTE, Animation.RELATIVE_TO_SELF, or Animation.RELATIVE_TO_PARENT三種。

// rotate標籤
android:fromDegrees 動畫開始的角度位置，正值表示從初始位置順時針旋轉該角度後的位置，負值則表示從初始位置逆時針旋轉該角度後的位置。
android:toDegrees 動畫結束的角度位置，取值範圍與fromDegrees一樣。
android:pivotX 旋轉中心點與控制元件左上角的橫向距離，預設為0，表示在控制元件的最左邊。型別可以為數值（畫素為單位），百分數（距離佔自己寬度的百分比）和百分數p（距離佔父控制元件寬度的百分比）。
android:pivotY 旋轉中心點與控制元件左上角的縱向距離，取值範圍與pivotX一樣。
程式碼表示：
RotateAnimation(Context context, AttributeSet attrs) 
通過構造方法載入屬性資源生成RotateAnimation物件。
RotateAnimation(float fromDegrees, float toDegrees) 
通過構造方法注入的引數生成RotateAnimation物件，預設旋轉中心點在控制元件左上角。
RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY) 
基於上面構造方法，預設旋轉中心點與控制元件左上角的距離單位是畫素。
RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue) 
基於上面構造方法，旋轉中心點與控制元件左上角的距離單位為Animation.ABSOLUTE, Animation.RELATIVE_TO_SELF, or Animation.RELATIVE_TO_PARENT三種。

// scale標籤
android:fromXScale 動畫開始在橫向的縮放比例，浮點數，0.0表示消失，1.0表示不變，2.0表示放大一倍。
android:toXScale 動畫結束在橫向的縮放比例，取值範圍與fromXScale一樣。
android:fromYScale 動畫開始在縱向的縮放比例，取值範圍與fromXScale一樣。
android:toYScale 動畫結束在縱向的縮放比例，取值範圍與fromXScale一樣。
android:pivotX 縮放中心點與控制元件左上角的橫向距離，預設為0，表示在控制元件的最左邊。型別可以為數值（畫素為單位），百分數（距離佔自己寬度的百分比）和百分數p（距離佔父控制元件寬度的百分比）。
android:pivotY 縮放中心點與控制元件左上角的縱向距離，取值範圍與pivotX一樣。
程式碼表示：
ScaleAnimation(Context context, AttributeSet attrs) 
通過構造方法載入屬性資源生成ScaleAnimation物件。
ScaleAnimation(float fromX, float toX, float fromY, float toY) 
通過構造方法注入的引數生成ScaleAnimation物件，預設縮放中心點在控制元件左上角。
ScaleAnimation(float fromX, float toX, float fromY, float toY, float pivotX, float pivotY) 
基於上面構造方法，預設縮放中心點與控制元件左上角的距離單位是畫素。
ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue) 
基於上面構造方法，縮放中心點與控制元件左上角的距離單位為Animation.ABSOLUTE, Animation.RELATIVE_TO_SELF, or Animation.RELATIVE_TO_PARENT三種。

// set標籤
android:shareInterpolator 是否使用公共的插值器，與android:interpolator配合使用。
從安卓4.0開始，在XML中配置起作用，但需注意：
若設定duration, repeatMode, fillBefore, fillAfter，會覆蓋孩子的相同屬性。
若設定startOffset, shareInterpolator，只對自己有效。
若設定repeatCount, fillEnabled，將被忽略。
程式碼表示：
AnimationSet(Context context, AttributeSet attrs) 
通過構造方法載入屬性資源生成AnimationSet物件。
AnimationSet(boolean shareInterpolator) 
通過構造方法注入的引數生成AnimationSet物件，包含的動畫是否使用公共的插值器。
addAnimation(Animation a) 
給動畫集合中新增一個子動畫。 

插值器，是對我們設定的動畫數值進行改變，預設變化方向由設定的起始值和終止值控制，那我們就根據系統提供的幾種常用插值器分析一下，效果參考。

• BaseInterpolator，一個抽象的插值器，用來作為擴充套件的基類（2-11是其子類）。
• AccelerateDecelerateInterpolator，數值按照預設變化方向先快後慢。
• AccelerateInterpolator，數值按照預設變化方向一直加快。
• AnticipateInterpolator，數值先與預設變化方向相反，後與預設變化方向相同。
• AnticipateOvershootInterpolator，數值先與預設變化的方向相反，後與預設變化的方向相同，接著與預設變化的方向相反。
• BounceInterpolator，值的變化模仿小球調到地面上的彈跳變化。
• CycleInterpolator，值的變化模仿正選函式，0₁0_-10。
• DecelerateInterpolator，數值按照預設變化方向一直減慢。
• LinearInterpolator，數值按照預設變化方向勻速變化。
• OvershootInterpolator，數值先與預設變化方向相同，後與預設變化方向相反。
• PathInterpolator，值的變化由規劃的路徑控制。
• FastOutLinearInInterpolator，值的變化符合(0,0) (0.4,0) (1.0,1.0) (1.0,1.0)控制的貝塞爾曲線。
• FastOutSlowInInterpolator，值的變化符合(0,0) (0.4,0) (0.2,1.0) (1.0,1.0)控制的貝塞爾曲線。
• LinearOutSlowInInterpolator，值的變化符合(0,0) (0,0) (0.2,1.0) (1.0,1.0)控制的貝塞爾曲線。

5.推薦資料

這裡就沒有配效果圖了，如果需要可以看一下啟艦的文章，我就是參考他的部落格寫的。為了便於大家理解，我用座標軸強調一下，假設動畫的展示效果為Y軸上的值，那麼時間是X軸上的值，之間滿足y=f(x)的關係。