实现自适应图标

Android O 引入了名为「自适应图标」（adaptive icon）的全新应用图标格式，旨在使一部设备上的所有图标风格更为连贯。本文将会探讨如何为你的应用创建自适应图标。由于短时间内，大多数应用不会将 minSdkVersion 设为 26，本文也将探讨如何高效地添加这种新的图标格式。

值得说明的一点是，Android Studio 3.0 引入了新的向导程序，可以帮助你创建自适应图标，但本文将不作讨论；本文中，我们只探讨最基本的格式和技巧。

如果你想知道自适应图标的来龙去脉，或者想了解如何设计自适应图标，请访问这两篇文章：《理解 Android 的「自适应图标」》和《设计自适应图标》。

基本知识

自适应图标是一个新的 drawable 类型，名为 AdaptiveIconDrawable 。你不需要直接操作这个类，只需在 XML 中定义，并在清单文件（manifest）中指向即可。可以遵循如下格式：

<adaptive-icon>
    <background android:drawable="@[drawable|mipmap|color]/bar"/>
    <foreground android:drawable="@[drawable|mipmap|color]/foo"/>
</adaptive-icon>

Drawable 元素大小应为 108dp * 108dp，背景 drawable 元素不透明度应为 100%，前景元素则可以设置其他不透明度。

minSDK 应为 26

自适应图标只能用于 API 26 及之后版本，所以你可以利用一些现有的特性，特别是对于 VectorDrawable 不错的支持。

然而，你不能使用自定义方式扩展（inflate）drawable 元素；由于你的应用图标可能会被其他应用的进程加载，你必须使用系统提供的 drawable 类型。

使用矢量图将会是不错的选择：一方面，你可以用体积很小的文件格式，一次性设置好 drawable 元素，另一方面，图像可以在任何像素密度下都十分锐利，不会因为迁就像素密度，使用太多位图而增加 APK 文件体积。

有一点需要指出，很多开发者似乎还没有充分利用 VectorDrawable 中对渐变的支持。就这一话题，我推荐大家阅读 Ian Lake 的这篇文章，其中也谈到了应用自适应图标的一些基本知识。

Ian 在文章中提到了如何使用简单的线性渐变，但 VectorDrawable 的功能可远不止于此。下面这段示例代码，就是用包括多个色标的径向渐变实现「长阴影」效果的部分代码。我还使用了内连资源句法（inline resource syntax），可以将原本的多个文件嵌入一个文件（通过 AAPT 实现，通常与 AnimatedVectorDrawable 一同使用）：

<vector ...>
  <path android:name="long-shadow"
        android:pathData="...">
    <aapt:attr name="android:fillColor">
      <gradient
          android:type="radial"
          android:centerX="54"
          android:centerY="54"
          android:gradientRadius="76.37">
        <!-- 中心到 32% 处为 15% 黑 -->
        <item android:offset="0.0" android:color="#26000000" />
        <item android:offset="0.32" android:color="#26000000" />
        <!-- 到 62% 处为 2% 黑 -->
        <item android:offset="0.62" android:color="#05000000" />
        <!-- 到最后为透明 -->
        <item android:offset="1.0" android:color="#00000000" />
      </gradient>
    </aapt:attr>
  </path>
  ...
</vector>

大多数应用图标都会（遵照 Material Design 设计指南的要求）设计投影元素，然而，这些设计往往不受 VectorDrawable 支持。而如果采用自适应图标，矢量图往往更能派上用场，原因有二：

现在，为图标加遮罩和生成投影，都由启动器负责，不需要将阴影写死在图标中；
由于图标是由前景和背景构成的，如果其中一层不包含／需要阴影效果，便可以使用矢量图来实现。

渐变确实可以用来模拟一些简单的阴影效果，但更为复杂的阴影效果则难以通过渐变实现。

可用栅格最小化

如果你的设计不能用矢量图实现，那当然也可以用 PNG 格式的图像。启动器图标（桌面图标）至关重要，当然值得多花一点空间打磨，以求效果完美。

要使用有透明区域的素材，倒是有一个不错的技巧，常用于制作自适应图标的前景。包含透明区域的素材虽然在构建时压缩效果不错，但在运行时，每个像素无论不透明度，都会占用 8 位内存。因此，为最小化内存占用，你可以将 PNG 图像周围的透明区域裁去，再使用再使用 InsetDrawable¹ 扩展（wrap），并填充为 108dp * 108dp 大小的素材。但是，使用 InsetDrawable 就无法缩放（即如果顶部插入（top inset）设为 16dp，那么无论 drawable 如何缩放，顶部插入也不会按比例变换，仍会保持 16dp）。因此，在 API 26 中，添加了比例插入（fractional inset）来解决这个问题。如此便可以将插入设定为 drawable 整体的一个百分比，实现正确的缩放。

例如，有一前景素材，大小为 54dp * 54dp，与其放置在 108dp * 108dp 的素材上，并套上透明部分，不如按如下代码设置：

<inset ...
    android:drawable="@mipmap/ic_fg_trimmed"
    android:insetLeft="25%"
    android:insetTop="25%"
    android:insetRight="25%"
    android:insetBottom="25%" />

下面这个例子也使用了这个技巧：

注意：你仍然需要为不同像素密度提供不同的栅格图像素材，但起码可以降低每张素材占用的空间和内存。

制作快捷方式

自适应图标不但可以用于应用图标，还能用于应用快捷方式。应用快捷方式可以固定在主屏幕，因此也需要与其他应用图标保持风格一致。Android O 之前的设计规范中，要求快捷方式功能图标必须放置于灰色圆形背景之上。而 Android O 中，图标背景应当填满整个自适应图标遮罩。如果没有升级为自适应图标，快捷方式图标将会被缩小，并放置在白色背景上。

为了让我自己的应用 Plaid 用上新的快捷方式样式，我起初在 API 26 的配置文件中添加了新的图标（新图标是把旧图标按照自适应图标的网格和参考线（keyline）重绘得到的）。但我不喜欢这种解决方案，因为新图标实际上是把 API 25 的旧图标缩放得到的，这就意味着我现在得管理两套图标。最后我决定把 API 25 使用的图标拆分成前景（即搜索图标）和背景（即灰色圆形），再用 LayerDrawable 合并：

<layer-list ...>
  <item android:drawable="@drawable/ic_app_shortcut_background"/>
  <item android:drawable="@drawable/ic_shortcut_search_foreground"/>
</layer-list>

这样一来，前景素材也能用于自适应图标了。在 API 25 中，应用快捷方式图标大小为 24dp * 24dp，前景素材总大小为 48 dp * 48 dp；而在 API 26 中，应用快捷方式图标大小则为 44dp * 44dp，前景素材总大小为 108 dp * 108 dp：

为使用 48dp * 48dp 的素材，需要设置插入，以确保素材缩放（矢量图万岁！）为 108dp * 108dp 后，图标大小正确；背景则是使用 ColorDrawable 实现。示例代码如下：

<adaptive-icon ...>
  <background android:drawable="@color/light_grey" />
  <foreground>
    <!-- 108dp 素材，每边设 10dp 填充 -->
    <inset
      android:drawable="@drawable/ic_shortcut_search_foreground"
      android:inset="9.26%" />
  </foreground>
</adaptive-icon>

AdaptiveIconDrawable 会将提供的素材缩放至 108dp * 108dp，故要计算插入量，应先将旧素材整体缩放至图标大小为 44dp：48dp ／ 24dp * 44dp = 88dp（即应缩放至 88dp），可见，每边插入量应为 10dp：10dp ／ 108dp * 100% = 9.26%。

要使用位图制作快捷方式图标，参见此链接。

多多试验

如果你正在制作自适应图标，可以使用 Adaptive Icon Playground 应用，来预览自适应图标的显示效果，尝试使用不同遮罩和不同动效。

你可以在此下载 APK 文件（设备必须运行 Android O），或在此下载源码。

勇敢「适应」吧！

希望这些建议可以帮你设计出优秀的自适应图标，让你的应用在用户的设备上体验更上一层楼。如果你有任何意见或者建议，请移步原文发表评论。