介绍:
SVG是什么?(可伸缩矢量图形:Scalable Vector Graphics)
1,定义用于网络的基于矢量的图形
2,使用XML格式定义图形
3,万维网联盟的标准
4,与诸如DOM和XSL之类的W3C标准是一个整体
5,图像在放大或改变尺寸的情况下其图形质量不会有所损失.
SVG可以实现什么东西呢,就像很多应用的的菜单按钮点击的时候,3条横线点击会变成一个箭头的样子就是SVG来实现的.
SVG在Web上的应用非常广泛，在Android 5.X之前的Android版本上，大家可以通过一些第三方开源库来在Android中使用SVG。而在Android 5.X之后，Android中添加了对SVG的<path>标签支持。从而让开发者可以使用SVG来创建更加丰富的动画效果。
由于SVG是用xml格式来定义的.所以要先了解下有什么标签格式:
M = moveto(M X,Y) ：将画笔移动到指定的坐标位置
L = lineto(L X,Y) ：画直线到指定的坐标位置
H = horizontal lineto(H X)：画水平线到指定的X坐标位置
V = vertical lineto(V Y)：画垂直线到指定的Y坐标位置
C = curveto(C X1,Y1,X2,Y2,ENDX,ENDY)：三次贝赛曲线
S = smooth curveto(S X2,Y2,ENDX,ENDY)：三次贝赛曲线
Q = quadratic Belzier curve(Q X,Y,ENDX,ENDY)：二次贝赛曲线
T = smooth quadratic Belzier curveto(T ENDX,ENDY)：映射前面路径后的终点
A = elliptical Arc(A RX,RY,XROTATION,FLAG1,FLAG2,X,Y)：弧线
Z = closepath()：关闭路径
有几点要注意：
坐标轴为以(0,0)为中心，X轴水平向右，Y轴水平向下。
所有指令大小写均可。大写绝对定位，参照全局坐标系；小写相对定位，参照父容器坐标系
指令和数据间的空格可以省略
同一指令出现多次可以只用一个
Google在Android 5.X中提供了两个新API来帮助支持SVG: VectorDrawable 和AnimatedVectorDrawable
其中，VectorDrawable让你可以创建基于XML的SVG图形，并结合AnimatedVectorDrawable来实现动画效果。
提供一个在线的SVG图形生成网站 http://editor.method.ac/ .
那么如何绘制SVG图形呢;我们可以在drawable目录右键点击NEW->Vector Asset
本地文件的话可以让设计将图转化成SVG格式给你.
选择一个图片生成出来的xml就是这样子的.
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="#FF000000"
android:pathData="M12,7.77L18.39,18H5.61L12,7.77M12,4L2,20h20L12,4z"/>
</vector>
viewportHeight，viewportWidth表示SVG图形划分比例。后面在绘制path时所使用的参数，就是根据这两个值来进行转换，比如上面的代码，将24dp划分为24份，如果在绘制图形时使用坐标(12,12)，则意味着该坐标位于该SVG图形正中间。所以，如果width，height的比例与viewportHeight，viewportWidth的比例不一致，就会使图形发生压缩，形变。
pathData 就是绘制SVG图形所用到的指令。
fillColor 这个属性表明绘制出来的是一个填充的图形，我在这个属性里设了一个白色，如果想要绘制一个非填充的图形，可以使用 strokeColor 。
然后在布局就可以直接引用drawable了.
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/ic_change_history_black_24dp"
/>
AnimatedVectorDrawable 的作用是给 VectorDrawable 提供动画效果。在XML文件中通过<animated-vector>标签来声明对 AnimatedVectorDrawable 的使用，并指定其作用的<path>或<group>。
举个例子，旋转动画:
我们先在drawable目录下创建一个静态的 VectorDrawable ,取名为test_vector.xml
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="200dp"
android:width="200dp"
android:viewportHeight="100"
android:viewportWidth="100"
>
<group android:name="test"
android:rotation="0">
<path android:strokeColor="#ff0000"
android:strokeWidth="2"
android:pathData="M 25 50 a 25,25 0 1, 0 50,0"/>
</group>
</vector>
在preview里面是这样子：
然后在res目录下新建animator目录新建一个objectAnimator文件,名为anim_path1.xml,
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="4000"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="360"
>
</objectAnimator>
最后写一个 animated-vector ,把 VectorDrawable 和 objectAnimator 连起来,在drawable中新建一个名为ic_animated_test.xml
<?xml version="1.0" encoding="utf-8"?>
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:drawable="@drawable/test_vector"
tools:targetApi="lollipop">
<target
android:name="test"
android:animation="@animator/anim_path1"
/>
</animated-vector>
这样整个动画就写完了，接下来在布局文件中引用 VectorDrawable
<ImageView
android:id="@+id/vector_animator_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_animated_test"
/>
然后在activity中通过((Animatable)imageview.getDrawable()).start(); 就可以启动动画了.
