檢視動畫

試試 Compose
Jetpack Compose 是 Android 推薦的 UI 工具包。瞭解如何在 Compose 中使用動畫。

您可以使用檢視區塊動畫系統,對檢視區塊執行中間動畫。補間動畫會使用起點、終點、大小、旋轉等資訊,以及動畫的其他常見方面,計算動畫。

Tween 動畫可對 View 物件的內容執行一系列簡單的轉換 (位置、大小、旋轉和透明度)。因此,如果您有 TextView 物件,可以移動、旋轉、放大或縮小文字。如果含有背景圖片,背景圖片會連同文字一起轉換。animation package 提供補間動畫中使用的所有類別。

動畫指令序列會定義補間動畫,可透過 XML 或 Android 程式碼定義。與定義版面配置一樣,建議使用 XML 檔案,因為與動畫硬式編碼相比,XML 檔案更易於閱讀、重複使用及替換。在以下範例中,我們使用 XML。(如要進一步瞭解如何在應用程式程式碼中定義動畫 (而非 XML),請參閱 AnimationSet 類別和其他 Animation 子類別)。

動畫指令會定義您想執行的轉換、轉換時間,以及套用轉換所需的時間。轉換可以是循序或同步進行,例如,您可以讓 TextView 的內容從左向右移動,然後旋轉 180 度,也可以讓文字同時移動和旋轉。每項轉換作業都會採用一組專屬參數 (例如大小變更的起始大小和結束大小、旋轉的起始角度和結束角度等),以及一組通用參數 (例如開始時間和持續時間)。如要同時進行多項轉換,請為這些轉換設定相同的開始時間;如要依序進行轉換,請計算開始時間,並加上前一個轉換的持續時間。

動畫 XML 檔案位於 Android 專案的 res/anim/ 目錄中。檔案必須具備單一根元素:可以是單一 <alpha><scale><translate><rotate>、插補器元素,或是包含這些元素群組 (可能包括另一個 <set>) 的 <set> 元素。根據預設,所有動畫指令都會同時套用。如要依序觸發這些動作,請務必指定 startOffset 屬性,如下例所示。

以下是其中一個 ApiDemos 的 XML,用於延展,然後同時旋轉 View 物件。

<set android:shareInterpolator="false">
    <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" />
    <set android: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>

畫面座標 (本例中未使用) 是左上角的 (0,0),並隨著您向下和向右移動而增加。

部分值 (例如 pivotX) 可相對於物件本身或父項指定。請務必使用正確的格式 (相對於父項的 50% 請使用「50」,相對於自身的 50% 請使用「50%」)。

您可以指派 Interpolator,決定轉換如何隨時間套用。Android 包含多個 Interpolator 子類別,可指定各種速度曲線,例如 AccelerateInterpolator 會指示轉換作業先慢後快。每個屬性都有可在 XML 中套用的屬性值。

將這個 XML 儲存為專案 res/anim/ 目錄中的 hyperspace_jump.xml 後,下列程式碼就會參照該 XML,並將其套用至版面配置中的 ImageView 物件。

Kotlin

AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump).also { hyperspaceJumpAnimation ->
    findViewById<ImageView>(R.id.spaceshipImage).startAnimation(hyperspaceJumpAnimation)
}

Java

ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);
Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
spaceshipImage.startAnimation(hyperspaceJumpAnimation);

除了 startAnimation() 之外,您也可以使用 Animation.setStartTime() 定義動畫的開始時間,然後使用 View.setAnimation() 將動畫指派給 View。

如要進一步瞭解 XML 語法、可用標記和屬性,請參閱「動畫資源」。

注意:無論動畫如何移動或調整大小,動畫所屬的 View 邊界都不會自動調整以配合動畫。即使如此,動畫仍會繪製在 View 的界線之外,且不會遭到裁剪。 不過,如果動畫超出上層 View 的界線,就會發生裁剪