Android frame animation use

Using a series of different pictures and playing them in sequence like a roll of film is a traditional animation, also known as frame animation. It can also be compared to playing in sequence like a roll of film. Playing it, it's a bit like looking at a GIF picture.

This article introduces the use of the animationdrawable class to achieve animation effects. For the convenience of development, we can specify the information of each frame of animation in XML.

This is the first example. Let's prepare 4 pictures (please bring your own pictures) and put them into RES / drawable /. In this directory, create a new file ani_ frame_ 1.xml。

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ani_frame_1"
    android:oneshot="false">
    <item
        android:drawable="@drawable/f_zan_1"
        android:duration="250" />
    <item
        android:drawable="@drawable/f_zan_4"
        android:duration="250" />
    <item
        android:drawable="@drawable/f_zan_3"
        android:duration="250" />
    <item
        android:drawable="@drawable/f_zan_2"
        android:duration="250" />
</animation-list>

You can see that the root node < animation list > contains four items. Each child node defines a frame. Duration is the frequency of this frame (in milliseconds). Drawable specifies the drawable resource. Oneshot = "false" means to let the animation play in a loop all the time. Then the animation resources are ready.

Prepare an ImageView in the layout and use it to display the animation

<ImageView
    android:id="@+id/iv1"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_marginTop="60dp" />

Operate the ImageView in the activity. Set the animation resource as the background.

var mFrameIv: ImageView? = null
// override fun onCreate(savedInstanceState: Bundle?)
mFrameIv = findViewById(R.id.iv1)
mFrameIv!!.setBackgroundResource(R.drawable.ani_frame_1)

Change the background of ImageView to animationdrawable. To play the animation, use the animationdrawable. Start () method.

val ani: AnimationDrawable = mFrameIv!!.background as AnimationDrawable
ani.start()

When the animation is playing, calling the start () method will not affect the current playback.

Stop animation, animationdrawable. Stop()

val ani: AnimationDrawable = mFrameIv!!.background as AnimationDrawable
ani.stop()

The stop () method stops the animation at the current frame. If you call start () again, it will play from the beginning.

Previously, we used the background resources of ImageView. We can also use Src. Prepare another animation resource ani_ frame_ 2。

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ani_frame_1"
    android:oneshot="true">
    <item
        android:drawable="@drawable/f_zan_1"
        android:duration="250" />
    <item
        android:drawable="@drawable/f_zan_4"
        android:duration="250" />
    <item
        android:drawable="@drawable/f_zan_3"
        android:duration="250" />
    <item
        android:drawable="@drawable/f_zan_2"
        android:duration="250" />
</animation-list>

Android: oneshot = "true", the animation will automatically stop and remain at the last frame after playing once.

Then, in layout, set it to SRC of ImageView.

<ImageView
    android:id="@+id/iv1"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_marginTop="60dp"
    android:src="@drawable/ani_frame_2" />

In the activity, instead of operating the background of ImageView, it operates drawable.

// 启动
val ani: AnimationDrawable = frameIv.drawable as AnimationDrawable
ani.start()

// 停止
val ani: AnimationDrawable = frameIv.drawable as AnimationDrawable
ani.stop()

As you can see, animationdrawable needs to be operated in both examples. It is important to note that the animationdrawable. Start() method cannot be called during the oncreate() method of the activity because animationdrawable has not been fully attached to the window. If you want to play the animation immediately without interaction, you may need to call from the OnStart () method in the activity, which will be called when Android renders the view on the screen.

The animationdrawable class has several properties to note