自适应图标,或
AdaptiveIconDrawable
、
显示的内容可能因具体设备功能和用户而异
主题。自适应图标主要由主屏幕上的启动器使用,
但也可用于快捷方式、“设置”应用、共享对话框和
概览屏幕。自适应图标适用于所有 Android 设备类型。
与位图相比 图片,自适应图标 以适应不同的应用场景:
不同的形状:自适应图标可以显示各种形状 在不同型号的设备上例如,它可以显示 并显示一个方圆形(方形和 圈子)。每个设备的原始设备制造商 (OEM) 都必须提供蒙版, 系统使用 来渲染具有相同形状的所有自适应图标。
图 1. 自适应图标支持多种 口罩(因设备而异)。 视觉效果:自适应图标支持各种富有吸引力的视觉效果 效果,当用户在住宅中放置或移动图标时显示 屏幕。
图 2. 视觉效果示例 自适应图标。 。用户主题设置:从 Android 13(API 级别 33)开始,用户可以设置主题 自适应图标。如果用户通过打开 系统设置中的带主题的图标切换开关,启动器支持此功能 功能时,系统会使用用户所选壁纸的颜色,并 主题来确定色调颜色。
图 3. 从 用户的壁纸和主题。 在以下情况下,主屏幕不会显示主题 应用图标,而改为显示自适应或标准应用图标:
- 如果用户未启用带主题的应用图标。
- 如果您的应用未提供单色应用图标。
- 如果启动器不支持带主题的应用图标。
设计自适应图标
为确保自适应图标支持不同的形状、视觉效果和 用户主题设置,则设计必须符合以下要求:
您必须为图标的彩色版本提供两个图层:一个用于 另一个用于后台。这些图层可以是矢量,也可以是 但最好使用矢量
图 4. 使用前景定义的自适应图标 和背景层。描绘的 66x66 安全区是区域 且永远不会被 OEM 定义的形状蒙版裁剪。 。</ph> 图 5.前景和 应用圆形蒙版后,背景图层可以一起显示。 如果您希望支持应用图标的用户主题设置,请提供一个图层, 单色版本的图标。
<ph type="x-smartling-placeholder"></ph> <ph type="x-smartling-placeholder">
</ph> 图 6.一个单色图标层(左侧), 颜色预览示例(右)。 将所有层的大小调整为 108x108dp。
使用边缘简洁的图标。图层不得有蒙版或背景 阴影。
使用尺寸至少为 48x48 dp 的徽标。尺寸不得超过 66x66dp, 因为图标的内部 66x66 dp 显示在遮罩内 视口
层四条边外侧的 18dp 分别是 以及创建视差或脉冲等视觉效果。
如需了解如何使用 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>
内部元素同时支持
矢量图像和位图图像。
以下示例展示了如何定义 <foreground>
、<background>
和
<adaptive-icon>
内的 <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()
方法。
如需详细了解如何实现自适应图标,请参阅实现 自适应 图标。 有关快捷方式的详细信息,请参阅应用快捷方式 概览。
其他资源
请参阅以下资源,详细了解如何设计和 如何实现自适应图标