android开发游记：VectorDrawable矢量图兼容性问题的解决方案

安卓5.0Lollipop发布以来VectorDrawable作为安卓环境下的矢量化图形的方式一直由于兼容性问题而很少被用到，由于只能用于5.0以上系统，导致现在多少安卓机无法使用而一直被开发人员无限搁置。在官方给出兼容性的解决方案之前，开发者社区已经有几个解决方案了。比如：

https://github.com/trello/victor
https://github.com/telly/MrVector
https://github.com/wnafee/vector-compat

但是就效果和易用性而言，我个人并不看好，其中MrVector已经停止维护，而vector-compat也已经很长时间没有更新过，而且经博主测试发现仅适用于Android gradle plugin 1.4以下的版本，1.5以后存在无法正确编译的问题。

官方也一直没有给出一个 VectorDrawableCompat 支持库来解决兼容性问题。

Android gradle plugin 1.5发布以后，加入了一个跟VectorDrawable有关的新功能。Android build tools 提供了另外一种解决兼容性的方案，如果编译的版本是5.0之前的版本，那么build tools 会把VectorDrawable生成对应的png图片，这样在5.0以下的版本则使用的是生成的png图，而在5.0以上的版本中则使用VectorDrawable

在build.gradle添加generatedDensities配置，可以配置生成的png图片的密度：

    defaultConfig {
        applicationId "com.liaoinstan.vectordrawablesupport"
        minSdkVersion 15
        targetSdkVersion 23
        versionCode 1
        versionName "1.0"
        generatedDensities = ['hdpi', 'xhdpi']
    }

不配置，默认全部生成。

那么，接下来测试一下：

创建一个支持5.0以下版本的工程，我这里最低支持到15，不配置generatedDensities 默认全部生成

    defaultConfig {
        applicationId "com.liaoinstan.vectordrawablesupport"
        minSdkVersion 15
        targetSdkVersion 23
        versionCode 1
        versionName "1.0"
    }

在drawable下创建一个vector.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="android">
        <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" />
        <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="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" />
        <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>
</vector>

然后在布局中添加一个ImageView引用该矢量图：

<ImageView  android:id="@+id/imageView" android:layout_width="300dp" android:layout_height="300dp" android:src="@drawable/vector" />

效果如下：

然后打包编译，从工程目录下找到编译生成的apk文件，路径如下：
VectorDrawableSupport\app\build\outputs\apk

然后将apk使用解压软件解压，在res文件夹下可以找到生成的各个屏幕密度对应的资源文件：

里面分别为不同分辨率的屏幕生成了不同规格的png图片

这种方案缺失解决了目前存在的VectorDrawable 的向下兼容的问题，但是为VectorDrawable 提供了各种复杂动画效果的AnimatedVectorDrawable依然无法在5.0以下的机型使用。

目前也没有什么较好的解决方案，一般通过机型的适配来为不同安卓版本制作2种资源，一种是支持动画的给5.0以上机器使用，一种是不支持动画的给5.0以下的机型使用。在使用AnimatedVectorDrawable的时候，把 AnimatedVectorDrawable资源放到 drawable-v21 目录中，并且在 drawable 中提供一个和 AnimatedVectorDrawable 同名字的资源来在 5.0之前的版本使用，在这个 xml 文件中可以使用一个 selector 来替代这个动画。

注意有时候为了简洁可能会把VectorDrawable下的pathData放到string.xml中，然后在VectorDrawable下引用，如：

<path  android:name="right_arm" android:fillColor="#9FBF3B" android:pathData="@string/mypath" />

如果通过生成png来兼容5.0以下机型的话，会报pathData错误，编译器不会去读取string.xml，我也不知道为啥要这样限制，总之只能把pathData写到VectorDrawable下。

<path  android:name="head" android:fillColor="#9FBF3B" android:pathData="M 12, 4 L 10.59, 13 L 18.99, 13 L 12, 20z" />

AnimatedVectorDrawable确实是一个非常实用的工具，能够通过配置来实现各种复杂的动画效果，让人眼前一亮，但是目前的兼容性问题却很让人头疼，改天再写写AnimatedVectorDrawable吧。