前言
上一篇，我们了解了SVG以及静态Vector图像使用，坐标地址如下：
聊聊有关SVG那些事儿
而今天，我们了解一下有关使用动态Vector使用的那点事儿。
PS：主要注意的是，动态Vector图像只能在Api 21以上使用，So，如果想要低版本也使用的话，必须做兼容，否则直接奔溃了~
So，一起来看本文目标。
本文目标
通过举例说明如何使用动态Vector图像以及如何兼容低版本，从而让你不经意间学会使用要领。
实现效果
Come on，baby~
首先，我们生成一个原图，也就是我们的小星星，我们设置宽高按照400等份平分，其次，设置我们中心点坐标为200，也就是正好一半，而动画的执行也就是从图像的中心点进行运动，而具体动画又可以具体到某个Path，也就是说，假设我们的静态Vector图像是由俩个Path组成，我们可以根据设置不同的name去区别对待(设置不同的动画效果)，具体代码如下：
代码语言：javascript复制<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="300px"
android:height="300px"
android:viewportHeight="400"
android:viewportWidth="400">
<group
android:name="star_group"
android:pivotX="200" // 由于宽度按照400等比例平分，设置一半大小也就意味着从中心进行动画效果
android:pivotY="200"
android:scaleX="1.0"
android:scaleY="1.0">
<path
android:name="star"
android:fillColor="#FF00FF"
android:pathData="M 200.30535,69.729172
C 205.21044,69.729172 236.50709,141.52218 240.4754,144.40532
C 244.4437,147.28846 322.39411,154.86809 323.90987,159.53312
C 325.42562,164.19814 266.81761,216.14828 265.30186,220.81331
C 263.7861,225.47833 280.66544,301.9558 276.69714,304.83894
C 272.72883,307.72209 205.21044,268.03603 200.30534,268.03603
C 195.40025,268.03603 127.88185,307.72208 123.91355,304.83894
C 119.94524,301.9558 136.82459,225.47832 135.30883,220.8133
C 133.79307,216.14828 75.185066,164.19813 76.700824,159.53311
C 78.216581,154.86809 156.16699,147.28846 160.13529,144.40532
C 164.1036,141.52218 195.40025,69.729172 200.30535,69.729172 z" />
</group>
</vector>接下来，我们着手实现我们的动画效果。需要在res下创建animator目录。
我们看效果图，可以很清晰的看到，首先动画的轨迹为：
❈
星星 ---> 勺子 再由 勺子 ---> 星星
❈
也就是切换动画，而这个动画会具有俩个属性：
- 从A到B，从B到A，动画的执行有个先后顺序；
- 仔细观察，变换的过程中，会有一点点加速的效果，考虑添加插值器
具体如下：star_shap.xml
代码语言：javascript复制<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_interpolator"
android:ordering="sequentially"
android:shareInterpolator="true">
<!-- 如果俩个SVG进行动画，则俩个节点需要一致 -->
<objectAnimator
android:duration="500"
android:propertyName="pathData"
android:valueFrom="@string/svgStarStr"
android:valueTo="@string/svgFoodStr"
android:valueType="pathType" />
<objectAnimator
android:duration="500"
android:propertyName="pathData"
android:valueFrom="@string/svgFoodStr"
android:valueTo="@string/svgStarStr"
android:valueType="pathType" />
</set>接下来，在执行的过程中除了俩个图像的交替，其中还掺杂着俩种动画：
- 缩放：x，y轴同时进行；
- 旋转
这里需要注意这俩个动画的执行同样也是有着顺序。
关键代码如下：star_ratate.xml
代码语言：javascript复制<set xmlns:android="http://schemas.android.com/apk/res/android"
android:ordering="sequentially">
<set android:ordering="together">
<objectAnimator
android:duration="300"
android:propertyName="scaleX"
android:valueFrom="0.0"
android:valueTo="1.0" />
<objectAnimator
android:duration="300"
android:propertyName="scaleY"
android:valueFrom="0.0"
android:valueTo="1.0" />
</set>
<objectAnimator
android:duration="500"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="360" />
</set>接下来，我们要为我们的星星添加动画，让它动起来~
底图就是我们的星星，还记得我们一开始添加的name么，一个是给path，一个是group，分别设置即可。
代码语言：javascript复制<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/vd_star">
<target
android:name="star_group"
android:animation="@animator/star_rotate" />
<target
android:name="star"
android:animation="@animator/star_shape" />
</animated-vector>为ImageView直接设置src即可：
代码语言：javascript复制 <ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:onClick="getAnim"
android:src="@drawable/animate_star" />最后，在MainActivity中进行如下操作：
代码语言：javascript复制 public void getAnim(View view){
ImageView imageView=(ImageView)view;
Drawable drawable=imageView.getDrawable();
if(drawable instanceof Animatable){
((Animatable)drawable).start();
}
}到此动动小手，点击运行瞅瞅~
还记得我们直接创建animated-vector文件时，提示的警告么？我们先一起来看下：
下面将进行详细说明。
兼容性开发怎么玩
上图很easy，提示我们这个东西只能在Android api 21以上使用，也就是5.0，当然你可以直接忽略此警告，直接运行在5.0以上的api毫无问题，当然，最好还是将此文件放置在drawable-v21目录下，但是，如果在5.0一下运行，则会出现不可思议的问题，详情看下图：
报出的异常如下：
那么如何在低版本运行呢？
找了很多的方式，暂时没有找到，希望各位老帖，如有好的解决方案，希望告知下~
GitHub查看地址
https://github.com/HLQ-Struggle/SVGStudy
历史文章
极光推送使用心得以及记录 一个key玩转第三方服务(微信支付、某某地图) GitHub学习篇之如何创建代码库以及删除代码库(简单易用)
