在某些情况下,图片需要在屏幕上呈现动画效果。如果您希望显示由多张图片组成的自定义加载动画,或者希望一个图标在用户执行操作后变为另一个图标,这种做法就非常实用。Android 提供了两个选项供您为可绘制对象添加动画效果。

第一个选项是使用 AnimationDrawable。使用该选项,您可以指定多个静态可绘制对象文件(每次展示一个)来创建动画。第二个选项是使用 AnimatedVectorDrawable。使用该选项,您可以为矢量可绘制对象的属性添加动画效果。

使用 AnimationDrawable

要为

虽然您可以使用 res/drawable/ 目录中。在这种情况下,具体指令是每个动画帧的顺序和时长。

XML 文件包含一个 元素(用作根节点)和一系列子 节点(每个节点定义一个帧):帧和帧时长的可绘制资源。以下是可绘制动画的 XML 文件示例:

android:oneshot="true">

此动画仅运行 3 帧。通过将列表的 android:oneshot 属性设置为 true,此动画仅循环一次,然后便停止并保持在最后一帧。如果设置为 false,则动画会一直循环。将此 XML 文件另存为 rocket_thrust.xml(位于项目的 res/drawable/ 目录中)后,可将其作为背景图片添加到视图,然后进行调用以播放。在以下示例 Activity 中,该动画添加到了

Kotlin
private lateinit var rocketAnimation: AnimationDrawable
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.main)
val rocketImage = findViewById(R.id.rocket_image).apply {
setBackgroundResource(R.drawable.rocket_thrust)
rocketAnimation = background as AnimationDrawable
}
rocketImage.setOnClickListener({ rocketAnimation.start() })
}Java
AnimationDrawable rocketAnimation;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
rocketImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
rocketAnimation.start();
}
});
}

请务必注意,对 start() 方法不能在 Activity 的 onCreate() 方法期间调用,因为 方法进行调用,该方法会在 Android 在屏幕上呈现视图时调用。

如需详细了解 XML 语法、可用标记和属性,请参阅动画资源。

使用 AnimatedVectorDrawable

矢量可绘制对象是一种无需像素化或进行模糊处理即可缩放的可绘制对象。借助 AnimatedVectorDrawableCompat),您可以为矢量可绘制对象的属性添加动画效果,例如旋转或更改路径数据以将其变为其他图片。

您通常在三个 XML 文件中定义添加动画效果之后的矢量可绘制对象:

一个矢量可绘制对象,其中 元素位于 res/drawable/

一个添加动画效果之后的矢量可绘制对象,其中 位于 res/drawable/

一个或多个对象 Animator,其中 元素位于 res/animator/

添加动画效果之后的矢量可绘制对象可以为 和 元素的属性添加动画效果。 元素定义一组路径或子组,而 元素定义要绘制的路径。

当您定义要添加动画效果的矢量可绘制对象时,请使用 android:name 属性,为各个组和路径指定唯一名称,以便您可以从 Animator 定义中引用它们。例如:

res/drawable/vectordrawable.xml
android:height="64dp"
android:width="64dp"
android:viewportHeight="600"
android:viewportWidth="600">
android:name="rotationGroup"
android:pivotX="300.0"
android:pivotY="300.0"
android:rotation="45.0" >
android:name="v"
android:fillColor="#000000"
android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
添加动画效果之后的矢量可绘制对象定义会按矢量可绘制对象中各个组和路径的名称对其进行引用:
res/drawable/animatorvectordrawable.xml
android:drawable="@drawable/vectordrawable" >
android:name="rotationGroup"
android:animation="@animator/rotation" />
android:name="v"
android:animation="@animator/path_morph" />
动画定义表示
res/animator/rotation.xml
android:duration="6000"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="360" />

以下示例中的第二个 Animator 会将矢量可绘制对象的路径从一个形状变为另一个形状。这两个路径都必须兼容变形:它们必须具有相同数量的命令,并且对于每个命令,必须具有相同数量的参数。

res/animator/path_morph.xml
android:duration="3000"
android:propertyName="pathData"
android:valueFrom="M300,70 l 0,-70 70,70 0,0 -70,70z"
android:valueTo="M300,70 l 0,-70 70,0 0,140 -70,0 z"
android:valueType="pathType" />