Vector Animation in Android

Vector Animation in Android

Using <path> tags in android to create SVG is like controlling a brush, moving a line from one point to another.

<path> Tag Support Properties
M = (Mx, y) moves to X, Y, and does not dash
L (Lx, y) straight to X, y, and simplified command h (x) Horizontal connection, V (y) Vertical connection
Z, no parameters, connection start and end
C= (Cx1, y1, x2, y2, x, y), Control point X1,y1 x2,y2, end point x, y
Q= (Qx1, y1, x, y), Control point x1,y1, end X, y
A (Arx, Ry, rotation, Flag1, Flag2, x, y) arc in (ellipse)
Rx,ry Half axis of ellipse
Rotation: The x-axis of the ellipse and the clockwise angle of the horizontal direction
Flag1:z only two values of 1 and 0 1 for Bigfoot Arc, 0 for small corner arc
Flag2:1 and 0 indicate clockwise and counterclockwise
x, y endpoint coordinates

I don't understand.

drawable Building an XML file

<vector xmlns:android= "Http://schemas.android.com/apk/res/android"
Android:width= "200DP"
android:height= "200DP"
Android:viewportwidth= "100.0"
android:viewportheight= "100.0" >
<group android:name= "Test1"
android:rotation= "0" >
<path
Android:strokewidth= "2"
Android:strokecolor= "#77ff33"
Android:pathdata= "m25,25 l25,50 L50, 50,l50,25z"
/>
</group>
</vector>

The Width,height,viewportwidth, Viewportheight, respectively, represent different meanings, and width and height represent the true size of the vector graph.

Viewportwidth and Viewportheight represent the partitioning of the vector graph, and the parameters used in the following path are converted based on these two values.
For example, the above code, 200 divided 100, then the l50,50 represents the entire vector image is the middle, so width,height and Viewportwidth, viewportheight than the column must be consistent, otherwise it will be deformed.

The vector image is drawn, and the animation must be indispensable.

There is a objectanimator in the property animation that is used to animate the effect, which is also true here

<objectanimator xmlns:android= "Http://schemas.android.com/apk/res/android"
android:duration= "4000"
Android:propertyname= "Rotation"
android:valuefrom= "0"
Android:valueto= "/>"

PropertyName used to fill in attributes

Animation definition, vector diagram also has, then how to integrate them into a piece, I think it should also be similar to the property animation, the vector diagram is drawn to ImageView, and then to ImageView animation.
Of course, there are other ways to be more powerful, using Animated-vector to integrate vector graphics and animations together.
<?xml version= "1.0" encoding= "Utf-8"?>
<animated-vector xmlns:android= "Http://schemas.android.com/apk/res/android"
android:drawable= "@drawable/vector1" >
<target
Android:name= "Test1"
android:animation= "@animator/obhectanimotr1"
/>
</animated-vector>

Http://www.open-open.com/lib/view/open1467861100069.html and http://blog.csdn.net/xu_fu/article/details/44004841 This blog is very good

In the above blog example will be useful to PropertyName Trimpathstart, this property means to draw the path of the graph according to a percentage of 0 to 1, trimpathend the same

Vector Animation in Android