自适应图标或 AdaptiveIconDrawable
可以根据各个设备的功能和用户主题以不同的方式显示。自适应图标主要由启动器在主屏幕上使用,但也可以用于快捷方式、设置应用、共享对话框和概述屏幕。自适应图标用于所有 Android 外形规格。
与 位图图像 相比,自适应图标可以适应不同的用例
不同的形状:自适应图标可以在不同的设备型号上显示各种形状。例如,它可以在一个 OEM 设备上显示圆形,而在另一个设备上显示圆角矩形(介于正方形和圆形之间的形状)。每个设备 OEM 必须提供一个蒙版,系统使用该蒙版以相同的形状呈现所有自适应图标。
视觉效果:自适应图标支持各种引人入胜的视觉效果,当用户在主屏幕上放置或移动图标时,这些视觉效果会显示。
用户主题:从 Android 13(API 级别 33)开始,用户可以为其自适应图标设置主题。如果用户通过打开系统设置中的主题图标切换启用主题应用图标,并且启动器支持此功能,则系统将使用用户选择的壁纸和主题的颜色来确定色调颜色。
在以下情况下,主屏幕不会显示主题应用图标,而是显示自适应或标准应用图标
- 如果用户未启用主题应用图标。
- 如果您的应用未提供单色应用图标。
- 如果启动器不支持主题应用图标。
设计自适应图标
为了确保您的自适应图标支持不同的形状、视觉效果和用户主题,设计必须满足以下要求
您必须为图标的颜色版本提供两层:一层用于前景,一层用于背景。这些图层可以是矢量或位图,但建议使用矢量。
如果您想支持用户对应用图标进行主题设置,请为图标的单色版本提供单层。
将所有图层的大小调整为 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()
方法。
有关实施自适应图标的更多信息,请参阅 实施自适应图标。有关快捷方式的更多信息,请参阅 应用快捷方式概述。
其他资源
有关设计和实施自适应图标的更多信息,请参阅以下资源。