Vector Drawable Animation

himanshu saluja
TechShots
Published in
2 min readJun 14, 2019
source

AnimatedVectorDrawable was added in Android 21. It provides us with the power of animation by using XML only. It animates the property of vector drawable using object animator or animator set.

Starting from android 25 AnimatedVectorDrawable run on the render thread, this means even if UI thread is doing the heavy lifting animation may be smooth. For API less than 21 AnimatedVectorDrawableCompat can be used.

AnimatedVectorDrawableCompat is defined in XML same as AnimatedVectorDrawable.Let's understand with an example

Basically, we need to define 3 main things

  1. Vector file itself
  2. Animation file
  3. Relation file for vector and animation

Now, these three can be either in one XML of 3 different XML.

Let's create a vector file with multiple paths and assign a unique name to each path

Now let's create an animation file. We have defined propertyName as “fillAlpha” as want to create the alpha effect. You can read more about tags present in object animator here

Now, we have an animation and we have the vector we need to apply this animation to vector.

We set the drawable as our vector resource, for each target that is identified using the name that we provided in vector, we can put the animation file. animated-vector tag will show a warning for android version but it will work if we apply it programmatically using AnimatedVectorDrawableCompat.

Just one last step to play the animation

Apply animated-vector to View.

For API≥21

Using AnimatedVectorDrawableCompat for backward support

Now play the animation :)

Instead of using 3 XML single XML can also be used as below

AnimatedVectorDrawable makes animation very easy and is very helpful for developers that too using existing knowledge.

For getting updates for interesting articles related to tech and programming to join TechShots.Its a start to a long journey. We will love the developers to be a part of this and publish blogs related to any tech they like. You can also send us suggestions at techshotscommunity@gmail.com.Your feedback is very valuable.

You can also follow us on facebook for all the updates.

--

--