使用动画移动视图

试试 Compose 方式

Jetpack Compose 是推荐用于 Android 的界面工具包。了解如何在 Compose 中使用动画。

为位置添加动画效果 →

由于用户互动或在后台处理，屏幕上的对象通常需要重新定位。您应使用动画将对象从起始位置移动到结束位置，而不应立即更新对象位置，立即更新对象位置会使对象从一个区域闪跳到另一个区域。

Android 允许您在屏幕上重新定位视图对象的位置之一是使用 ObjectAnimator。您可以提供希望对象停留的结束位置，以及动画的持续时间。您还可以使用时间插值器来控制动画的加速或减速。

使用 ObjectAnimator 更改视图位置

ObjectAnimator API 提供了一种更改具有指定时长的视图属性的方法。它包含用于创建 ObjectAnimator 实例的静态方法，具体取决于您要添加动画效果的属性类型。在屏幕上重新定位视图时，请使用 translationX 和 translationY 属性。

下面是一个 ObjectAnimator 示例，它会在 2 秒内将视图移动到距离屏幕左侧 100 像素的位置：

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 表示距离屏幕左侧的像素数为 100。

下一个方法以毫秒为单位指定动画的持续时间。在此示例中，动画运行了 2 秒（2000 毫秒）。

最后一个方法用于让动画开始运行，这会更新视图在屏幕上的位置。

如需详细了解如何使用 ObjectAnimator，请参阅使用 ObjectAnimator 添加动画。

添加曲线动作

虽然使用 ObjectAnimator 很方便，但默认情况下，它会沿起点和终点之间的直线重新定位视图。Material Design 使用曲线来实现对象在屏幕上的空间移动以及动画的计时。使用曲线运动可让应用更具实质感，同时让动画更有趣。

定义您自己的路径

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 规范中的三种基本曲线提供 XML 资源：

• @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)。其他构造函数参数取决于要创建的贝塞尔曲线的类型。

例如，对于二次贝塞尔曲线，只需要一个控制点的 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();
}

这会产生一个缓动曲线，该曲线开始时速度较快，随着接近结束而减速。

三次贝塞尔构造函数同样具有固定的起点和终点，但它需要两个控制点：

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();
}

这会生成与三次贝塞尔曲线示例相同的缓和曲线，但它会改用 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();