前言
首先，需要讲解两个概念——SVG和Vector。
SVG，即Scalable Vector Graphics 可缩放的矢量图，这种图像格式在前端中已经使用的非常广泛了。这种图片的最大特点就是自由拉伸不失真。
Vector，在Android中指的是Vector Drawable，也就是Android中的矢量图。因此，可以说Vector就是Android中的SVG实现。
Vector Drawable在Android的存在形式主要是XML形式。设置只要
<ImageView
android:id="@+id/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/android"
/>
(用src还是srccompat会有区别的，还未研究)
文件aa.xml如下：
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:viewportWidth="500"
android:viewportHeight="500"
android:width="500px"
android:height="500px">
<group android:name="aa">
<group android:name="head_eyes">
<path
android:name="head"
android:fillColor="#9FBF3B"
android:pathData="M301.314,83.298l20.159-29.272c1.197-1.74,0.899-4.024-0.666-5.104c-1.563-1.074-3.805-0.543-4.993,1.199L294.863,80.53c-13.807-5.439-29.139-8.47-45.299-8.47c-16.16,0-31.496,3.028-45.302,8.47l-20.948-30.41c-1.201-1.74-3.439-2.273-5.003-1.199c-1.564,1.077-1.861,3.362-0.664,5.104l20.166,29.272c-32.063,14.916-54.548,43.26-57.413,76.34h218.316C355.861,126.557,333.375,98.214,301.314,83.298" />
<path
android:name="left_eye"
android:fillColor="#FFFFFF"
android:pathData="M203.956,129.438c-6.673,0-12.08-5.407-12.08-12.079c0-6.671,5.404-12.08,12.08-12.08c6.668,0,12.073,5.407,12.073,12.08C216.03,124.03,210.624,129.438,203.956,129.438" />
<path
android:name="right_eye"
android:fillColor="#FFFFFF"
android:pathData="M295.161,129.438c-6.668,0-12.074-5.407-12.074-12.079c0-6.673,5.406-12.08,12.074-12.08c6.675,0,12.079,5.409,12.079,12.08C307.24,124.03,301.834,129.438,295.161,129.438" />
</group>
<group android:name="arms">
<path
android:name="left_arm"
android:fillColor="#9FBF3B"
android:pathData="M126.383,297.598c0,13.45-10.904,24.354-24.355,24.354l0,0c-13.45,0-24.354-10.904-24.354-24.354V199.09c0-13.45,10.904-24.354,24.354-24.354l0,0c13.451,0,24.355,10.904,24.355,24.354V297.598z" />
<path
android:name="right_arm"
android:fillColor="#9FBF3B"
android:pathData="M372.734,297.598c0,13.45,10.903,24.354,24.354,24.354l0,0c13.45,0,24.354-10.904,24.354-24.354V199.09c0-13.45-10.904-24.354-24.354-24.354l0,0c-13.451,0-24.354,10.904-24.354,24.354V297.598z" />
</group>
<path
android:name="body"
android:fillColor="#9FBF3B"
android:pathData="M140.396,175.489v177.915c0,10.566,8.566,19.133,19.135,19.133h22.633v54.744c0,13.451,10.903,24.354,24.354,24.354c13.451,0,24.355-10.903,24.355-24.354v-54.744h37.371v54.744c0,13.451,10.902,24.354,24.354,24.354s24.354-10.903,24.354-24.354v-54.744h22.633c10.569,0,19.137-8.562,19.137-19.133V175.489H140.396z" />
</group>
</vector>
至于这其中的属性，参考此篇文章
优点
- 自动适配，不需要多套视图，拉伸缩小不变形
- Vector图像可以大幅减少图像的体积，同样一张图，用Vector来实现，可能只有PNG的几十分之一
- 不需要很多代码，就可以实现复杂的动画
注：以前有三种的实现动画方式，其中属性动画objectAnimator？？？？？？
获得Vector
第一步就是如何获得Vector这个xml文件。
有两种方法：
阿里巴巴矢量图上提供很多精美的图片，其中就有SVG，PNG,AI三种方法输出，选择SVG，下载下来就是.SVG文件。这种方法的缺点就是不一定有你想要的图片
手头上有png的图片资源，找美工，使用PS、Illustrato工具，都是可以输出SVG格式文件.
使用android studio里面的功能 ，将SVG文件转化成Vector Drawable
2.有在线将普通图像转换为Android Vector Drawable的网站,使用方便，自己动手，丰衣足食
指定动画
AnimatedVectorDrawable可以让VectorDrawable动起来。AnimatedVectorDrawable通过改变VectorDrawable的属性来让VectorDrawable呈现动画效果。
通常定义一个AnimatedVectorDrawable需要以下三个xml文件：
1.vector drawable本身：
2.一个或者多个属性动画文件：res/drawable/中定义一个有<objectAnimator>元素的xml文件。
3.vector drawable的动画文件（Animated vector drawable）：res/drawable/中定义一个有<animated-vector>元素的xml文件。用来指定属性动画文件对应于vector drawable的是哪一部分。
例如，针对上面的vector，我们定义一个动画animated_android.xml。
<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/android">
<target
android:animation="@animator/shrug"
android:name="head_eyes" />
<target
android:animation="@animator/shrug"
android:name="arms" />
</animated-vector>
<?xml version="1.0" encoding="utf-8"?>
shrug.xml动画文件如下：
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:propertyName="translateY"
android:valueType="floatType"
android:valueFrom="0"
android:valueTo="-10"
android:repeatMode="reverse"
android:repeatCount="infinite"
android:duration="250" />
</set>
然后在代码中运行动画(动画演示一)
ImageView androidImageView = (ImageView) findViewById(R.id.android);
Drawable drawable = androidImageView.getDrawable();
if (drawable instanceof Animatable) {
((Animatable) drawable).start();
}
demo效果
Vector特点
- Vector Drawable应该相对简单，因为每一小块的图案都会生成一个PATH。可以通过动画来移动每一小块的图案，类似于把图片打碎。然后控制每个部分各自移动，最终的整体效果就会好。相对于Vector，属性动画更倾向于将整体，整个图片，进行缩放、平移、旋转，透明化等。
Vector性能问题
- Bitmap的绘制效率并不一定会比Vector高，它们有一定的平衡点，当Vector比较简单时，其效率是一定比Bitmap高的，所以，为了保证Vector的高效率，Vector需要更加简单，PathData更加标准、精简，当Vector图像变得非常复杂时，就需要使用Bitmap来代替了
- Vector适用于ICON、Button、ImageView的图标等小的ICON，或者是需要的动画效果，由于Bitmap在GPU中有缓存功能，而Vector并没有，所以Vector图像不能做频繁的重绘
- Vector图像过于复杂时，不仅仅要注意绘制效率，初始化效率也是需要考虑的重要因素
- SVG加载速度会快于PNG，但渲染速度会慢于PNG，毕竟PNG有硬件加速，但平均下来，加载速度的提升弥补了绘制的速度缺陷。
