拥抱SVG：苦恼于图片适配 in Android？

前言

不管是开发 Android 已久的老司机，还是刚刚上车的新司机，都肯定会对一件事情深恶痛绝：图片适配（尤其是在美工不给力的条件下）！为什么 Android 手机要有这么多不同的分辨率？ 为什么我的图片在这台手机上显示地好好的完全符合设计图的要求结果换到另一台手机上就变形了？Oh my god !

以前为了解决图片在不同的分辨率的屏幕上显示不一致的问题，通常我们会采取两种方式：一是根据不同的分辨率建立不同的资源包，然后每个要用到的图片资源都需要做成多种尺寸的以适配不同的分辨率；二是干脆直接放一个分辨率比较大的图片，然后钦定 ImageView 的大小，强行把图片塞进去——由于图片的分辨率比较大，所以在大部分机型上也还是能看的。但是这两种方式都有一些问题，首先不可避免的，都极容易导致 apk 包的体积变大，这个问题在 app 体量比较小的时候可能不会对产品造成什么干扰，但是当体量逐渐变大，这将是个极为让人头疼的问题。另外，用第一种方法完成过图片适配的兄弟都懂，把不同尺寸的图片更名为符合规范的相同名字并放到它们合适的文件夹里面去简直是一种折磨。。。

这样的痛苦体验什么时候才是个头？

拥抱SVG吧。

PS：我用 SVG 动画写了一个类似于 Google 2016 I/O 大会上的那个时钟的东西，应该是一个比较好的学习 SVG 在 Android 上的使用的资源，大家可以去关注一下点点 star 提提 issue 哈，地址是：GoogleClock，贴个截图：

正文

1，什么是 SVG ？ && SVG VS 位图

SVG是指可伸缩矢量图形 (Scalable Vector Graphics)，它不同于传统的位图，不是通过存储图像中每一点的像素值来保存与使用图形，而是通过 XML 文件来定义一个图形，通过一些特定的语法和规则来绘制出我们所需的图像——同样是使用一张图片，SVG 的方式是事先定义好怎么去画这个图，然后等要用的时候再把它去画出来，而使用传统的位图的话就是已经有了画出来的图，然后要用的时候直接把画好的图拿出来用。这样一来的话我们就很容易可以分析出它们两种方式之间的优劣之处：

• SVG 是在要用图的时候再把图画出来，所以理所当然的在图片显示的时候会花费更多的时间消耗更多的资源。
• 同样由于上一个原因， SVG 并不太适合层次过于复杂细节过于繁多的图片。
• 位图是事先已经画好的图片，所以适应性必然没有 SVG 好，同一张图片在不同分辨率下显示会有差异。
• SVG 的文件里存储了绘制图片的相关信息，所以我们能够对图片的线条有一个非常清晰的感知，这在做动画的时候特别有用。
• SVG 没有存储任何图像的像素信息，所以 SVG 的文件体积远小于传统的位图文件。
• SVG 的文件画出来的图像是矢量图，所以不会存在失真的问题，理论上支持任何级别的缩放。

从上面的分析大家可以发现，在 SVG 的众多优点下， 它的缺点几乎可以忽略不计了（当然，前提是它所耗费的资源不会对用户体验造成较大的影响）——这也正是本文标题 “拥抱SVG” 的由来。

2，SVG in Android

既然 SVG 这么好，那么为什么当前并没有多少 Android 应用是使用了 SVG 图片的呢？因为市场。Android对于 SVG 的支持是从 Android L 开始的，它的 SDK 里面加入了 VectorDrawable , AnimatedVectorDrawable 等类帮助我们构建 SVG 图形以及动画，并且你可以在 xml 文件里面直接使用 标签绘制 SVG 图像以及 标签为 SVG 图像分配动画。

但是请注意