CODEWITHSUNDEEP
androidandroid-animationobjectanimatorandroid-vectordrawable
skwear
skwear

Reputation: 581

Fade out and translate VectorDrawable with ObjectAnimator

I am trying to get an AnimatedVectorDrawable to fade out and translate at the same time. I made an ObjectAnimator resource:

<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
    android:propertyName="translationX"
    android:duration="@+string/animtime"
    android:valueFrom="0"
    android:valueTo="150"
    android:valueType="floatType"/>
<objectAnimator
    android:propertyName="alpha"
    android:duration="@+string/animtime"
    android:valueFrom="255"
    android:valueTo="0"
    android:valueType="intType"/>

Then targeted a VectorDrawable with the ObjectAnimation:

<target
    android:name="disgust"
    android:animation="@anim/fadetransout" />

The VectorDrawable is a <group> in a VectorDrawable resource file.

But when I start the animation nothing is happening. What am I doing wrong?

I found this in the stack trace:

Method setTranslationX() with type float not found on target class class android.graphics.drawable.VectorDrawable$VGroup
Method setAlpha() with type int not found on target class class android.graphics.drawable.VectorDrawable$VGroup

Does it have something to do with this?

If this isn't possible, is there another way I can get my VectorDrawable to fade and translate?

Thank you.

Upvotes: 3

Views: 4133

Answers (1)

skwear
skwear

Reputation: 581

I have found out what I have done wrong. I took a second look at this and realized what the problem was. What I didn't say, and didn't think mattered was that the disgust drawable is a <group> and <group> does have an x translation attribute but it's called translateX, so that's the first thing that I got wrong.

The second thing is that the attribute alpha is for the entire <vector> which is the "parent" of <group>. What I actually wanted was something to change the alpha of a <path>. This is done by using the attribute fillAlpha. fillAlpha is a float that goes from 0 to 1. 0 being transparent and 1 being opaque. 0 to 255 means it fades in 255 times in the duration.

The lastly, these two objectAnimators cannot be together in the same XML file, since one is for a <group> and one is for a <path>. So the final result is this:

In a file called translate_out.xml I now have,

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:propertyName="translateX"
        android:duration="@integer/animation_duration"
        android:valueFrom="0"
        android:valueTo="150" />
</set>

And in another file called fade_out.xml I now have,

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:propertyName="fillAlpha"
        android:duration="@integer/animation_duration"
        android:valueFrom="1"
        android:valueTo="0" />
</set>

And finally in vectordrawable.xml I have,

<target
    android:name="disgust_path"
    android:animation="@anim/fade_out" />
<target
    android:name="disgust"
    android:animation="@anim/translate_out" />

where disgust_path is now a path a I have named that was always inside the disgust group.

I have moved the animation time string to integers.xml and called it animation_duration.

Upvotes: 14

Related Questions