Android App Development
iOS App Development
Cross Platform App Development
Hire on-demand project developers and turn your idea into working reality.
Big thanks to Webkul and his team for helping get Opencart 18.104.22.168 release ready!
Owner and Founder. Opencart
Animated Vector Drawable added in Lollipop is a feature which provides you the ability to make your vector drawable images start moving.
First, you want to learn how to draw vector drawable in XML. To draw VectorDrawable you want to learn SVG path. If you have SVG file, you can convert it to VectorDrawable using vector asset tool in you Android Studio.
The above code segment is an example of a vector drawable (let’s say ic_download.xml) and each path represents a line or figure. The image generated by this segment is given below
Now to make a particular path move you have to define that path inside a group tag and must provide it with a specific name. There can be more than one group in a single vector drawable XML.
Now your vector drawable is ready. Its time to create an animator.
Create a new folder “animator”under “res” folder if its not there and inside it create a new XML file (let’s say ic_download_animator.xml)
as you can see there are several tags, so now lets discuss about some main tags.
<set> = this is an animation set which contains different animators and a particular set is executed to show the movement.
<objectAnimator> = This is one animation. it can be either along X axis or Y axis or in a rotation which is to be mentioned in propertyName attribute.
Now your vector drawable and animator is ready its time to combine them to create an animation. For that, you have to create an XML file in your “drawable” folder (lets say ic_download_animation.xml)
As you can see in the above code segment the
<animated-vector> = It defines that this particular vector drawable is can be animated and inside it the attribute android:drawable defines which drawable to use for the animation.
<target> = This tag is used to combine the group and the animator so that a group can be animated according to the animator.
Now when you have combined your vector drawable and animator you can use this (ic_download_animation.xml) in your main layout XML.
No, still your animation will not work. To start the animation you have to call the start() function Drawable class whenever you want to start the animation. You can use the below code segment for that.
That’s all !!! make your own animator and animate your vector drawables.
Thank you very much, this is Vedesh Kumar signing off.
Your email address will not be published. Required fields are marked*
Save my name email and website in this browser for the next time I comment.
We've bought a Shopware Extension which is a hybrid App, which we can now offer in the Google Play Store and the IOS App Store. I'am still impressed how fast and how sharp the support team leads us through every process of the App-Store clarification. Very fast and useful response.
Founder, Das Apartment Living
Enquiry or Requirement
If you have more details or questions, you can reply to the received confirmation email.