使用動畫移動檢視畫面

螢幕上的物件通常因為使用者互動或 並在背景處理系統不會立即更新物件的 位置 - 在不同區域之間閃爍，因此使用動畫 將物件從起始位置移到結束位置

Android 可讓您重新調整畫面上檢視物件的位置 使用 ObjectAnimator。由您提供結束位置 物件和動畫持續時間你可以 並使用時間內插器控制

使用 ObjectAnimator 變更檢視畫面位置

ObjectAnimator API 可讓你以指定持續時間變更檢視畫面的屬性。 其中包含建立 ObjectAnimator 例項的靜態方法，具體情況取決於 您要建立動畫的屬性類型針對以下項目重新調整檢視畫面的位置時 請使用 translationX 和 translationY 屬性。

以下是將檢視畫面移至位置 100 的 ObjectAnimator 範例 從螢幕左側算起的 2 秒內

Kotlin

ObjectAnimator.ofFloat(view, "translationX", 100f).apply {
    duration = 2000
    start()
}

Java

ObjectAnimator animation = ObjectAnimator.ofFloat(view, "translationX", 100f);
animation.setDuration(2000);
animation.start();

本範例使用 ObjectAnimator.ofFloat()敬上 方法，因為翻譯值必須是浮點值。第一個參數是 。第二個參數則是 動畫。由於檢視畫面需要水平移動，因此 translationX 屬性。最後一個參數是動畫的結束值。在本 例如 100 表示位置，從 。

下一個方法會指定動畫播放時間 (以毫秒為單位)。在本 例如，動畫會執行 2 秒 (2000 毫秒)。

最後一個方法會觸發動畫，進而更新檢視畫面的位置 。

如要進一步瞭解如何使用 ObjectAnimator，請參閱使用 ObjectAnimator，

新增曲線動態效果

ObjectAnimator 很方便，但根據預設，它會將 即可查看起點和終點之間的直線材質 設計上必須依賴曲線，以呈現螢幕上物件的空間移動 播放特定動畫的時間使用曲線動態可為應用程式增添質感 讓動畫更加有趣

自行定義路徑

ObjectAnimator 類別的建構函式可讓您為座標加上動畫效果 同時使用兩個以上的屬性和路徑。適用對象 舉例來說，下列動畫師會使用 Path 物件，為 X 和 Y 建立動畫 檢視屬性：

Kotlin

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    val path = Path().apply {
        arcTo(0f, 0f, 1000f, 1000f, 270f, -180f, true)
    }
    val animator = ObjectAnimator.ofFloat(view, View.X, View.Y, path).apply {
        duration = 2000
        start()
    }
} else {
    // Create animator without using curved path
}

Java

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  Path path = new Path();
  path.arcTo(0f, 0f, 1000f, 1000f, 270f, -180f, true);
  ObjectAnimator animator = ObjectAnimator.ofFloat(view, View.X, View.Y, path);
  animator.setDuration(2000);
  animator.start();
} else {
  // Create animator without using curved path
}

以下是弧形動畫的呈現方式：

圖 1. 曲線路徑動畫。

Interpolator 實作了加/減速曲線詳情請參閱 Material Design 說明文件 ，進一步瞭解加/減速曲線的概念。Interpolator 會定義動畫中特定值如何計算為 讓應用程式從可以最快做出回應的位置 回應使用者要求這套系統為 Material Design 規格：

  • @interpolator/fast_out_linear_in.xml
  • @interpolator/fast_out_slow_in.xml
  • @interpolator/linear_out_slow_in.xml

使用 PathInterpolator

PathInterpolator敬上 類別是 Android 5.0 (API 21) 中導入的內插器。它採用根據 貝茲曲線 Path 物件。Material Design 說明文件中的 Android 範例， 加/減速 使用 PathInterpolator。

PathInterpolator 具有以不同類型貝茲曲線為基礎的建構函式。 所有貝茲曲線的起點和終點都固定在 (0,0) 和 (1,1)。 。其他建構函式引數取決於 Bézier 的類型 已建立曲線。

舉例來說，針對貝茲曲線的二次曲線，只需要 X 和 Y 座標 需要一個控制點：

Kotlin

val myInterpolator = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    PathInterpolator(0.67f, 0.33f)
} else {
    LinearInterpolator()
}

Java

Interpolator myInterpolator = null;
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  myInterpolator = new PathInterpolator(0.67f, 0.33f);
} else {
  myInterpolator = new LinearInterpolator();
}

這會產生加/減速曲線，開始的速度很快，而在減速時則會減速 接近尾聲

三次方 Bézier 建構函式也有固定的起點和終點，不過 需要兩個控制點：

Kotlin

val myInterpolator = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    PathInterpolator(0.5f, 0.7f, 0.1f, 1.0f)
} else {
    LinearInterpolator()
}

Java

Interpolator myInterpolator = null;
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  myInterpolator = new PathInterpolator(0.5f, 0.7f, 0.1f, 1.0f);
} else {
  myInterpolator = new LinearInterpolator();
}

這是 Material Design 強調的 減速 加/減速曲線。

如需更大的控制項，任意 Path 可用來定義曲線：

Kotlin

val myInterpolator = if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  val path = Path().apply {
    moveTo(0.0f, 0.0f)
    cubicTo(0.5f, 0.7f, 0.1f, 1.0f, 1.0f, 1.0f)
  }
  PathInterpolator(path)
} else {
  LinearInterpolator()
}

Java

Interpolator myInterpolator = null;
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  Path path = new Path();
  path.moveTo(0.0f, 0.0f);
  path.cubicTo(0.5f, 0.7f, 0.1f, 1.0f, 1.0f, 1.0f);
  myInterpolator = new PathInterpolator(path);
} else {
  myInterpolator = new LinearInterpolator();
}

這產生的加/減速曲線與 cubic Bézier 範例相同，但使用 請改為使用「Path」。

您也可以把路徑內插器定義為 XML 資源：

<pathInterpolator xmlns:android="http://schemas.android.com/apk/res/android"
    android:controlX1="0.5"
    android:controlY1="0.7"
    android:controlX2="0.1f"
    android:controlY2="1.0f"/>

建立 PathInterpolator 物件後，您可以將其傳遞至 Animator.setInterpolator() 方法。Animator 會使用內插器判斷時間或路徑 曲線開始時

Kotlin

val animation = ObjectAnimator.ofFloat(view, "translationX", 100f).apply {
    interpolator = myInterpolator
    start()
}

Java

ObjectAnimator animation = ObjectAnimator.ofFloat(view, "translationX", 100f);
animation.setInterpolator(myInterpolator);
animation.start();