VectorDrawable入门
基础
api21以后新添加的一个api，用于定义矢量图形。矢量图形可以定义在xml文件中，其根结点为<vector>。
简单点说：将图形的边界看成一条闭合曲线，通过定义若干个控制点，并将控制点通过直线或者曲线连接起来，再填充上颜色，便形成了一个图形。
vector元素
path元素
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="64dp"
android:width="64dp"
android:viewportHeight="100"
android:viewportWidth="100">
<path
android:fillColor="#000000"
android:pathData="M25 0, l 50 50 -50 50Z"/>
</vector>
其定义了一个三角形，如下：
在pathData中，有一些字母，这些字母便是指令。
指令
这些指令是与android中的Path类中的某些方法是对应的。如下：
M(m)：相当于Path.moveTo()，开始新一段的path。
L(l)：相当于Path.lineTo()，移动到指定的点。
H(h)：水平移动。
V(v)：竖直移动。
C(c)：三阶贝塞尔曲线。相当于Path.cubicTo()。
S(s)：同C，但比C要更平滑。
Q(q)：二阶贝塞尔曲线
T(t)：同Q，但比q平滑。
A(a)：弧线。相当于Path.arcTo()。
Z(z)：关闭。相当于Path.close()。
每一个指令都有大小写，大写表示绝对定位，小写表示相对定位。
各个指令后需要跟上数量不同的参数，M，L，H，V后面只跟两个，分别表示下一个点的x坐标和y坐标。略。z指令无参数，略。
c(x1 y1 x2 y2 x y)：前两个为贝塞尔曲线的控制点的坐标，最后一个为Path路径上的点的坐标。
q(x1 y1 x y)：第一个表示贝塞尔曲线的控制点坐标，第二个表示path路径上的点的坐标。
a(rx ry rotation big_flag sweep_flag x y)：rx ry分别表示弧线所属椭圆的x,y半轴，rotation表示x轴旋转角度，big-flag表示弧线是否取较大段，1表示是，0表示不是。sweep_flag表示是否顺时针旋转，1表示是，0表示不是。x,y表示终点的半径。有图解：
绝对与相对定位
指令的大小写分别代表着绝对定位与相对定位。绝对定位指的是这个点在drawable中的坐标，而相对定位指的是这个点相较于前一个点移动的坐标。如：
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="64dp"
android:width="64dp"
android:viewportHeight="100"
android:viewportWidth="100">
<path
android:fillColor="#000000"
android:pathData="M25 0, l50 50 -50 50Z"/>
<path
android:fillColor="#ff0000"
android:pathData="M25 0, L75 50 25 50Z"/>
</vector>
其效果为：
group元素
一组Path集或者group集，并且可以为该group指定一个移动信息，这些信息包括缩放，旋转，平移。也就是说可以为了一个group指定一个动画。常用属性：
name：group名。
pivotX，pivotY：旋转绽放的中心点。同path中的坐标一样，都是按viewportWidth,viewportHeight定义的。
scaleX，scaleY：x,y轴的缩放比例。
translateX，translateY：x,y轴的平移距离。
rotation：旋转角度。
animated-vector
可以执行属性动画的vectordrawable。常用属性
drawable：用于指定当前要关联的vectordrawable。它可以含有target元素。
target
用于指定要作用的group和作用的属性动画。常用属性：
name：指定要作用的group。
animation：指定该group要执行的属性动画。示例见后面的动画部分。
示例
该例是一个太极图的效果。如下：
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="1000dp"
android:height="1000dp"
android:viewportHeight="600"
android:viewportWidth="600">
<path
android:fillColor="#ffffff"
android:pathData="M200 200,m0 -100,a100 100 0 1 1 0 200z" />
<path
android:fillColor="#000000"
android:pathData="M200 200,m0 -100,a100 100 0 1 0 0 200z" />
<path
android:fillColor="#ffffff"
android:pathData="M200 150,m0 50,a50 50 0 1 1 0 -100,a50 50 0 1 1 0 100z" />
<path
android:fillColor="#000000"
android:pathData="M200 250,m0 50,a50 50 0 1 0 0 -100z" />
<path
android:fillColor="#000000"
android:pathData="M200 150,m0 10,a10 10 0 1 1 0 -20,a10 10 0 1 1 0 20z" />
<path
android:fillColor="#ffffff"
android:pathData="M200 250,m0 10,a10 10 0 1 0 0 -20,a10 10 0 1 0 0 20z" />
</vector>
其效果图为：
动画
使用属性动画可以使vector动起来。主要分为三步：
1，创建一个vectordrawable
2，创建属性动画
3，创建AnimatedVectorDrawable对象，并与第一步创建的vectordrawable关联，且与第2步创建的属性动画关联。如下：
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="1000dp"
android:height="1000dp"
android:viewportHeight="600"
android:viewportWidth="600">
<group
android:name="taiji"
android:pivotX="200"
android:pivotY="200">
<path
android:fillColor="#ffffff"
android:pathData="M200 200,m0 -100,a100 100 0 1 1 0 200z" />
<path
android:fillColor="#000000"
android:pathData="M200 200,m0 -100,a100 100 0 1 0 0 200z" />
<path
android:fillColor="#ffffff"
android:pathData="M200 150,m0 50,a50 50 0 1 1 0 -100,a50 50 0 1 1 0 100z" />
<path
android:fillColor="#000000"
android:pathData="M200 250,m0 50,a50 50 0 1 0 0 -100z" />
<path
android:fillColor="#000000"
android:pathData="M200 150,m0 10,a10 10 0 1 1 0 -20,a10 10 0 1 1 0 20z" />
<path
android:fillColor="#ffffff"
android:pathData="M200 250,m0 10,a10 10 0 1 0 0 -20,a10 10 0 1 0 0 20z" />
</group>
</vector>
这是上面的太极图，只不过将所有的path使用group包裹起来。因为group有动画属性，在使用属性动画时，需要使用这些属性。
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/demo_vector">
<target
android:name="taiji"
android:animation="@animator/taiji_anim" />
</animated-vector>
通过drawable属性关联要操作的vectordrawable。通过target指定vectordrawable中哪一部分指定哪个动画。对应的属性动画如下：
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:propertyName="rotation"
android:valueFrom="360"
android:repeatCount="infinite"
android:valueType="floatType"
android:valueTo="0" />
这里指定的valueType，该属性有三个值，floatType,intType和pathType。使用pathType时，可以对vectordrawable中的pathData进行修改，达到一引起很炫的效果。如下：
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:propertyName="pathData"
android:valueFrom="M170 250,Q200 275 230 250"
android:repeatCount="infinite"
android:repeatMode="reverse"
android:valueType="pathType"
android:valueTo="M170 250,Q200 225 230 250" />
使用该属性动画时，可以将pathData的值从valueFrom转成valueTo。从而实现pathData的转变，实现动画。其对应的vector为：
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="1000dp"
android:height="1000dp"
android:viewportHeight="600"
android:viewportWidth="600">
<path
android:fillColor="#ffffff"
android:pathData="M200 200,m0 -100,a100 100 0 1 1 0 200,a100 100 0 1 1 0 -200z" />
<path
android:fillColor="#ff0000"
android:pathData="M160 170,m0 -15,a15 15 0 1 1 0 30,a15 15 0 1 1 0 -30z" />
<path
android:fillColor="#ff0000"
android:pathData="M230 170,m0 -15,a15 15 0 1 1 0 30,a15 15 0 1 1 0 -30z" />
<path
android:name="taiji"
android:pathData="M170 250,Q200 225 230 250"
android:strokeColor="#00ff00"
android:strokeLineCap="round"
android:strokeWidth="8" />
</vector>
使用该drawable时，可以发现图案由笑脸转变为哭脸。