安卓客户端使用矢量图

目录

概述

什么是矢量图

使用矢量图节省内存开销原理

矢量图内存占用实测

使用矢量图

​

安卓客户端支持矢量图格式

什么样的位图图片适合转换成矢量图

兼容低版本使用矢量

---

概述

在android客户端使用矢量图，可以节省内存开销。

什么是矢量图

矢量图，称为绘图图像，定义为一系列由线连接的点。按照path 路径绘制出来，写像素无关，可以将它缩放到任意大小和以任意分辨率在输出设备上打印出来，都不会影响清晰度。 

使用矢量图节省内存开销原理

项目中使用的 png webp jpg 等位图，显示在屏幕上，消耗的内存与像素素有关。通过getResource().getDrawable(R.drawable.pic) 获取的 Drawable对象为BitmapDrawable类型。

矢量图是通过canvs对象，通过path标签中的路径数据，直接绘制出来的。它与像素无关，与shape标签一样，几乎是不消耗什么内存的。

矢量图内存占用实测

使用几张矢量图，VectorDrawable对象占用内存如下，都不超过1KB。

      

使用矢量图

使用vector标签的xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="80dp"
    android:height="48dp"
    android:viewportWidth="80"
    android:viewportHeight="48">
    <path
        android:fillAlpha="0.51"
        android:fillColor="#f00"
        android:pathData="M21.33,0L58.64,0C69.56,1.34 78.64,10.42 80,21.34L80,26.66C78.64,37.57 69.58,46.63 58.68,48L21.34,48C10.44,46.64 1.37,37.58 0,26.68L0,21.34C1.35,10.43 10.43,1.36 21.33,0M19.45,2.58C10.68,4.33 3.52,11.96 2.33,20.82C0.84,29.99 5.98,39.69 14.37,43.66C19.78,46.49 26.05,45.96 31.95,46C40.33,45.93 48.71,46.15 57.09,45.88C66.2,45.53 74.62,38.89 77.03,30.08C79.46,22.15 76.74,13.02 70.5,7.6C65.8,3.29 59.28,1.72 53.03,2C41.85,2.31 30.58,1.34 19.45,2.58Z"
        android:strokeAlpha="0.51" />
    <path
        android:fillAlpha="0.51"
        android:fillColor="#f00"
        android:pathData="M24.78,11.49C25.73,10.42 26.67,9.35 27.62,8.29C31.71,12.47 35.86,16.58 40,20.71C44.16,16.57 48.3,12.43 52.43,8.27C53.35,9.35 54.28,10.43 55.2,11.51C51.03,15.41 47.14,19.6 42.98,23.5C46.87,27.85 51.21,31.77 55.23,35.99C54.29,37 53.34,38 52.39,38.99C48.26,34.9 44.23,30.7 40.01,26.69C35.96,30.43 32.26,34.51 28.27,38.29C26.75,40.07 25.49,37.14 24.28,36.41C28.42,32.2 32.78,28.17 36.77,23.82C33.36,19.32 28.75,15.59 24.78,11.49Z"
        android:strokeAlpha="0.51" />
</vector>

与调用png 位图一样，可在xml中直接引用

安卓客户端支持矢量图格式

矢量图有很多格式，svg ai psd 等，但是安卓并不能直接使用，AppCompatImageView 使用  app:srcCompat 属性可以加载。

安卓原生从5.0系统开始支持 vector标签的矢量图，我们将png图片转换成svg psd等格式，再转成vector Asset。如上图，转换成vector标签的xml文件，可以直接放在drawable资源文件下

什么样的位图图片适合转换成矢量图

项目本地图片中小图片，图标等一般都适合使用矢量图。

色彩、图形较简单的图片适合转换成矢量图，复杂的图案不适合转换成矢量图。正常来说，UI在做完设计图后，提交到蓝湖等UI管理项目，开发者从项目中下载图片资源，选择矢量图格式，能下载到的矢量图都是适合使用矢量图的图片，其余图片下载位图格式的图片。

如果项目是老项目，想将位图转换成矢量图，可以将项目中所有图片复制出来，剔除重名的图片，按图片文件大小排列，关注一下前面的大图片，挑选出不适合转换成矢量图的图片，将剩下的小图片批量转换成矢量图。

兼容低版本使用矢量

安卓原生从5.0系统开始支持 vector标签的矢量图，通过在build.gralde中配置就可以支持api7及以上，基本上可以解决问题

 android {
   defaultConfig {
     vectorDrawables.useSupportLibrary = true
    }
 }

引用其它作者的文章：https://blog.csdn.net/z_x_Qiang/article/details/77978874

备注：

1)如果项目的minSdkVersion<21 （5.0），且未如上兼容设置，生成的apk文件中，矢量图会被移动  drawable-anydpi-v21  文件夹下面，同时会在 不同的drawable- 路径文件夹下面生成对应的png图片，这样会导致apk文件增加。这样处理的是 api 21及以上使用矢量图，在21以下使用对应的png图片，这些png图片是由studio编译时自动生成的。当使用兼容处理后就不会再生成png图片了。相同级别drawable 目录下如果有同名的位图，则不会在该目录下再自动生成对应的png图片。

2)系统调用规律

当安卓项目中有同名的图片，有矢量图和位图，例如有 矢量图 a.xml和位图a.png 两张图片，系统会优先使用矢量图。如果如上设置了兼容低版本使用矢量图，由不允许在同目录下面使用同名的图，即 a.xml和a.png是不允许在一个目录下同时使用，否则会报资源重复问题。

在生成的apk中，矢量图并不会替代其它dpi目录中的同名文件，矢量图是可以任意缩放的，所以，凡是使用了矢量图， 其它 dpi目录下的同名图片可以选择手动删除，它们的存在已经没有实际意义，反而会增加apk体积。

F&A

1. 5.0以下版本在xml中需要使用 app:srcCompat 来加载矢量图，否则不显示。

2. 创建的选择器、list-layer等标签下，如果有 android:drawable 标签，也是不能使用矢量图的，这是因为5.0以下系统的 drwable标签是不能识别 矢量图的，如果用了，会崩溃。

---