自适应图标

自适应图标 (AdaptiveIconDrawable) 可能会根据个别设备的功能和用户主题设置以不同的方式显示。自适应图标主要由主屏幕上的启动器使用，但也可用于快捷方式、“设置”应用、共享对话框和概览屏幕。自适应图标会用于所有 Android 外形规格。

与位图图片相比，自适应图标可适应不同的用例：

  • 不同形状：自适应图标可以在不同的设备型号上显示为各种形状。例如，它可以在一台 OEM 设备上显示圆形，在另一台设备上显示方块（正方形和圆形之间的形状）。每个原始设备制造商 (OEM) 都必须提供一个蒙版，系统使用该蒙版渲染所有具有相同形状的自适应图标。

    一张 GIF 图片，显示了同一个 Android 示例图标的重复动画，该图标根据所使用的蒙版展示不同的形状 - 一个圆形，然后是两种不同的曲棍球
    图 1. 自适应图标支持各种蒙版，蒙版因设备而异。

  • 视觉效果：自适应图标支持各种引人入胜的视觉效果，当用户在主屏幕上放置或移动图标时，就会显示这些效果。

    一张 GIF 图片，显示了两个圆形 Android 示例图标，这些图标以动画形式展示了用户响应。第一个图标显示了 Android 徽标在圆圈内左右摇晃。第二个图标展开，然后再次收缩。
    图 2. 由自适应图标显示的视觉效果示例。

  • 用户主题设置：从 Android 13（API 级别 33）开始，用户可以为其自适应图标设置主题。如果用户启用带主题的应用图标（通过开启系统设置中的带主题的图标切换开关），并且启动器支持此功能，系统会使用用户选择的壁纸和主题的配色来确定色调颜色。

    一张图片，显示了三台 Android 设备的示例，每台设备显示了采用不同色调的不同用户主题：第一张显示了采用深色色调的壁纸；第二张显示的是金色壁纸；第三张展示了一张壁纸，壁纸是浅灰色和蓝色色调。在每个示例中，图标都沿用了壁纸的色调，并与其完美融合。
    图 3. 沿用用户壁纸和主题的自适应图标。

    在以下情况下，主屏幕不会显示带主题的应用图标，而是显示自适应或标准应用图标：

    • 如果用户未启用带主题的应用图标。
    • 如果您的应用不提供单色应用图标。
    • 如果启动器不支持带主题的应用图标。

设计自适应图标

为确保自适应图标支持不同的形状、视觉效果和用户主题，设计必须满足以下要求：

  • 您必须为图标的颜色版本提供两个图层：一个用于前景，一个用于背景。这些层可以是矢量，也可以是位图，但最好使用矢量。

    一张图片，显示前景图层（左图）和背景图层（右图）的示例。前景中显示了一个示例 Android 徽标的 16 边图标，该徽标位于 66x66 安全区域的中心位置。安全区域的中心位于 108x108 容器的中心。背景针对安全区域和容器显示相同的测量尺寸，但仅显示蓝色背景，没有徽标。
    图 4. 使用前景图层和背景图层定义的自适应图标。66x66 安全区域是指永远不会被 OEM 定义的形状蒙版裁剪的区域。
    一张图片，显示上一张图片中的图标叠加在圆形蒙版上。
    图 5.应用圆形蒙版后，前景图层和背景图层一起呈现的效果示例。

  • 如果您想支持用户设置应用图标主题，请为图标的单色版本提供单个图层。

    单色图标层示例（左侧图片）和颜色预览（右侧图片）的示例图片。单色图层显示示例 Android 徽标的 16 边图标，该徽标位于 66x66 安全区域的中心位置。安全区域的中心位置是 108x108 容器。当此图层应用于颜色不同的用户主题（橙色、粉色、黄色和绿色）时，颜色预览会显示此图层的显示效果。
    图 6.单色图标层（左侧）和颜色预览示例（右侧）。

  • 将所有图层的大小调整为 108x108 dp。

  • 使用边缘简洁的图标。图层的图标轮廓周围不得有遮罩或背景阴影。

  • 使用尺寸至少为 48x48 dp 的徽标。该图标不得超过 66x66 dp，因为图标的内层 66x66 dp 显示在遮盖视口内。

层的四侧各有 18 dp 的外层专门留作遮盖和创建视差或脉动等视觉效果。

如需了解如何使用 Android Studio 创建自适应图标，请参阅我们的 Android 应用图标 Figma 模板或关于如何创建启动器图标的 Android Studio 文档。此外，请参阅博文设计自适应图标。

将自适应图标添加到您的应用

与非自适应图标一样，自适应图标需使用应用清单中的 android:icon 属性指定。

可选属性 android:roundIcon 供表示具有圆形图标的应用使用的启动器使用。如果应用的图标包含圆形背景作为其设计的核心部分，该属性可能很有用。此类启动器通过对 android:roundIcon 应用圆形蒙版来生成应用图标，这可以保证您优化应用图标的外观，例如稍微放大徽标并确保剪裁后圆形背景会全出血。

以下代码段说明了这两个属性，但大多数应用仅指定 android:icon：

<application
    ...
    android:icon="@mipmap/ic_launcher"
    android:roundIcon="@mipmap/ic_launcher_round"
    ...>
</application>

接下来，将您的自适应图标保存到 res/mipmap-anydpi-v26/ic_launcher.xml。使用 <adaptive-icon> 元素可定义图标的前景、背景和单色图层资源。<foreground>、<background> 和 <monochrome> 内部元素同时支持矢量图片和位图图片。

以下示例展示了如何在 <adaptive-icon> 内定义 <foreground>、<background> 和 <monochrome> 元素：

<?xml version="1.0" encoding="utf-8"?>
...
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
    <background android:drawable="@drawable/ic_launcher_background" />
    <foreground android:drawable="@drawable/ic_launcher_foreground" />

    // Starting with Android 13 (API level 33), you can opt-in to providing a
    // <monochrome> drawable.
    <monochrome android:drawable="@drawable/ic_launcher_monochrome" />
</adaptive-icon>
...

您还可以将可绘制对象定义为元素，只需将它们内联到 <foreground>、<background> 和 <monochrome> 元素中即可。以下代码段举例说明了如何使用前景可绘制对象执行此操作。

<?xml version="1.0" encoding="utf-8"?>
...
<foreground>
   <inset
       android:insetBottom="18dp"
       android:insetLeft="18dp"
       android:insetRight="18dp"
       android:insetTop="18dp">
       <shape android:shape="oval">
           <solid android:color="#0000FF" />
       </shape>
   </inset>
</foreground>
...

如果您想对快捷方式应用与常规自适应图标相同的蒙版和视觉效果，请使用以下方法之一：

  • 对于静态快捷方式，请使用 <adaptive-icon> 元素。
  • 对于动态快捷方式，请在创建时调用 createWithAdaptiveBitmap() 方法。

如需详细了解如何实现自适应图标，请参阅实现自适应图标。 如需详细了解快捷方式，请参阅应用快捷方式概览。

其他资源

如需详细了解如何设计和实现自适应图标，请参阅以下资源。