Android 的矢量图片格式VectorDrawable [复制链接]

2019-4-12 10:13
谷歌开发者 阅读:433 评论:0 赞:0
Tag:  

因为 Android 设备通常具有不同的尺寸、形状和屏幕像素密度,所以我更喜欢用与分辨率无关的矢量资源(vector assets)。但它们究竟是什么?有什么益处?需要什么成本?什么时候应该使用它们?怎么创建和使用它们?在这一系列文章中,我将会探讨这些问题并解释为什么在你的应用中应该大量地使用矢量资源(vector assets)以及怎样最大限度地使用它们。

位图 vs 矢量图

大多数的图像格式(png、jpeg、bmp、gif 和 webp 等等)都是位图格式,这意味着它们将图像绘制为一个固定的像素网格。因此,对于固定分辨率的位图,我们只了解每个像素的颜色,却不理解其中包含的内容。然而,矢量图像是通过在抽象大小的画布上定义一系列形状来描绘图像。

为什么使用矢量图?

矢量资源有三大好处,分别是:

  • 好用
  • 占用资源少
  • 动态

好用

矢量图可以优雅的调整大小;这是因为它们将图像绘制在抽象大小的画布上,你可以放大或缩小画布,然后重新绘制对应尺寸的图像。但是,位图资源在重新调整大小后会变得很糟糕。缩小栅格资源是 OK 的(意味着会丢失一些信息),但是放大它们会导致模糊或者色带状的失真,因为它们必须插入缺失的像素。

放大的位图(左)与放大的矢量图(右)

这就是为什么在 Android 上我们需要为不同密度的屏幕提供多个版本的位图资源:

  • res/drawable-mdpi/foo.png
  • res/drawable-hdpi/foo.png
  • res/drawable-xhdpi/foo.png

在需要的时候,Android 会选择最接近的较大密度并将其缩小。随着设备具有越来越高的屏幕密度,应用开发者对相同的资源必须不断创建、囊括、转换更多的版本。需要注意的是,许多现代设备的屏幕密度并不是精确的(例如,Piexl 3 XL 是 552 dpi,介于 xxhdpi 和 xxxhdpi 之间),所以资源通常会被缩放。

因为矢量资源可以优雅的调整大小, 你只需包含单个资源,它就能在具有任何屏幕密度的设备上呈现。

占用资源少

矢量资源通常会比位图资源占用资源更少,因为你只需要提供一个版本,而且矢量资源很好被压缩。

例如, Google I/O app 在 这次提交 中通过将一些 PNG 图标从位图转换成矢量图,节约了 482 KB。尽管听上去不是很多,但这仅仅是对小图像而言;更大的图片(如插图)会节省更多。

这张 插图 来自于上一年的 Google I/O 示例 APP 流程:

对于插图,矢量是很好的选择

我们无法用 VectorDrawable 替换它,因为当时没有广泛支持渐变(现在已经支持),所以我们不得不发布一个位图版本


我来说两句
您需要登录后才可以评论 登录 | 立即注册
facelist
所有评论(0)
领先的中文移动开发者社区
18620764416
7*24全天服务
意见反馈:1294855032@qq.com

扫一扫关注我们

Powered by Discuz! X3.2© 2001-2019 Comsenz Inc.( 粤ICP备15117877号 )