How to restart android AnimatedVectorDrawables animations?

Question

I have a kinda complex vector drawable that I want to animate. I used @RomanNurik's web tool to create the animation from a svg

That gives me a valid <animated-vector> according to the documentatios. It's an "all in one" XML file.

The xml has the drawable divided in 2 groups, each group containing 2 paths and has also added 4 animations, just as follows:

<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:aapt="http://schemas.android.com/aapt">
    <aapt:attr name="android:drawable">
        <vector xmlns:android="http://schemas.android.com/apk/res/android"
            android:width="56dp"
            android:height="56dp"
            android:viewportHeight="56.0"
            android:viewportWidth="56.0">
            <group
                android:name="group_1"
                android:pivotX="25"
                android:pivotY="25">
                <path
                    android:name="path_3_1"
                    ... />
                <path
                    android:name="path"
                    ... />
            </group>
            <group
                android:name="group"
                android:pivotX="25"
                android:pivotY="25">
                <path
                    android:name="path_1"
                    ... />
                <path
                    android:name="path_2"
                    ... />
            </group>
        </vector>
    </aapt:attr>
    <target android:name="path">
        <aapt:attr name="android:animation">
            <set xmlns:android="http://schemas.android.com/apk/res/android">
                <objectAnimator
                    android:name="path"
                    ... />
                <objectAnimator
                    android:name="path"
                  .../>
            </set>
        </aapt:attr>
    </target>
    <target android:name="group_1">
        <aapt:attr name="android:animation">
            <set xmlns:android="http://schemas.android.com/apk/res/android">
                <objectAnimator
                    android:name="group_1"
                    ... />
                <objectAnimator
                    android:name="group_1"
                    ... />
                <objectAnimator
                    android:name="group_1"
                    ... />
                <objectAnimator
                    android:name="group_1"
                    ... />
            </set>
        </aapt:attr>
    </target>
    <target android:name="group">
        <aapt:attr name="android:animation">
            <set xmlns:android="http://schemas.android.com/apk/res/android">
                <objectAnimator
                    android:name="group"
                    ... />
                <objectAnimator
                    android:name="group"
                    ... />
                <objectAnimator
                    android:name="group"
                    ... />
                <objectAnimator
                    android:name="group"
                    ... />
            </set>
        </aapt:attr>
    </target>
    <target android:name="path_3_1">
        <aapt:attr name="android:animation">
            <set xmlns:android="http://schemas.android.com/apk/res/android">
                <objectAnimator
                    android:name="path_3_1"
                    ... />
                <objectAnimator
                    android:name="path_3_1"
                    ... />
            </set>
        </aapt:attr>
    </target>
</animated-vector>

Issue number 1:

I cannot use android:repeatCount="infinite" since the ObjectAnimators have different android:duration and android:startOffset values, that would mess up the animation after some runs. So the way to go is repeat it programmatically. Fair enough.

Issue number 2:

Neither AnimatedVectorDrawableCompat or AnimatedVectorDrawable have a method that says animation should loop.

Issue number 3:

AnimatedVectorDrawableCompat does not have a registerAnimationCallback() so I can listen to onAnimationEnd and restart the animation myself. At this point, I gave up on retrocompatibility.

Issue number 4:

The current implementation I have that uses registerAnimationCallback() from AnimatedVectorDrawable only works at android API 25, even though the methods were added in API 23

AnimatedVectorDrawable drawable = (AnimatedVectorDrawable) context().getDrawable(R.drawable.long_press_anim);
imageView.setImageDrawable(drawable);
drawable.registerAnimationCallback(new Animatable2.AnimationCallback() {
    @Override
    public void onAnimationEnd(Drawable drawable) {
        super.onAnimationEnd(drawable);
        ((AnimatedVectorDrawable) drawable).start();
    }
});
drawable.start();

In API 23 and 24 the animation runs as a one-shot, it does not repeat.

Any ideas how to solve this? I;m about to give up and use a shit png sequence instead.

Answer 1

The official and working answer is here: https://issuetracker.google.com/issues/64591234

This code works with >= API 16 (probably also 14-15). I'm using support library 26.1.0 and vectorDrawables.useSupportLibrary = true (so I can refer to a vector drawable in xml without crashing)

animatedVector = AnimatedVectorDrawableCompat.create(getContext(), R.drawable.animated_clock);
ringingAlarmImage.setImageDrawable(animatedVector);
final Handler mainHandler = new Handler(Looper.getMainLooper());
animatedVector.registerAnimationCallback(new Animatable2Compat.AnimationCallback() {
    @Override
    public void onAnimationEnd(final Drawable drawable) {
        mainHandler.post(new Runnable() {
            @Override
            public void run() {
                animatedVector.start();
            }
        });
    }
});
animatedVector.start();

Answer 2

I am giving a few tips

Issue Number 1: android:repeatCount="0" to make it infinite. and android:repeatMode="restart" or "reverse".

Issue Number 2: Looping is there in ObjectAnimator. The above, under Number one is the same.

Issue Number 3:Listener is there on ObjectAnimator. If you add a listener you can watch onAnimationEnd or onAnimationStart.

Instead of a single file if you opt for the other alternative of 3 files as given in documentation for AnimatedVectorDrawable you can feel comfortable to handle.

The three are 1. VectorDrawable, 2. AnimatedVectorDrawable and 3.ObjectAnimator

The AnimatedVectorDrawable links the other two.

There is a good article in Ray Wenderlich's site with a rocket and a doge animation at : https://www.raywenderlich.com/173345/android-animation-tutorial-with-kotlin (with java code).

You may also read the article "Introduction to Icon animation Techniques" by Mr.Alex Lockwood at : https://www.androiddesignpatterns.com/2016/11/introduction-to-icon-animation-techniques.html The source code is also available in GitHub.

Answer 3

I have the same issue so I did this:

// setup and set animation
AnimatedVectorDrawableCompat animatedVector = AnimatedVectorDrawableCompat.create(context, R.drawable.listening_vector_anim);
imageView.setImageDrawable(animatedVector);

// loop animation!
new Thread(() -> {
    while (imageView.isAttachedToWindow()) {
        try {
            imageView.post(() -> animatedVector.start());
            Thread.sleep(2000); //depends on your animation duration
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}).start();

This thread will die when the ImageView detach from window.