Android 应用程序图标实用指南:自适应图标解释(以及如何正确生成您的图标)

Illustration of a single app icon design masked into a circle, a squircle, and a rounded square for different Android launchers and iOS

对于初次接触 Android 开发者来说,这是一个常见的惊喜:您为应用程序图标打磨一个方形 PNG,以整洁的 512x512 导出它,并且它在图像编辑器中看起来很完美。然后,您在三星手机上安装调试版本,图标突然看起来被裁剪并且稍微偏离中心,就好像徽标的一部分被切掉了一样。文件本身没有任何问题。问题在于,单个方形图像永远无法在与 Android 启动器的现实世界接触后幸存下来,每个启动器都会以不同的方式裁剪、遮罩和重塑图标。如果您还没有遇到过这种情况,那么您迟早会遇到这种情况,所以让我们来看看到底发生了什么,以及如何第一次就解决问题。

为什么单个方形 PNG 已经不够了

在 Android 的最初几年,应用程序图标正是它们看起来的样子:每个启动器都按原样显示的单个方形(或偶尔为自由形状)PNG。这种做法一直很有效,直到制造商开始在视觉上区分他们的手机,而最容易做到这一点的地方之一就是主屏幕。三星想要圆角正方形,一些中国 OEM 皮肤想要不同的边角处理,而原生 Android 最终选择了圆形。突然之间,完全相同的图标文件看起来明显不同,有时甚至明显更糟,具体取决于它落在谁的手机上。

谷歌在 Android 8.0 Oreo 中推出的答案是自适应图标系统。开发人员不是提供一种固定的形状,而是提供分层的艺术作品,操作系统本身将其屏蔽成给定启动器喜欢的任何形状。视觉识别保持一致;仅外部轮廓发生变化。

自适应图标到底是什么?

自适应图标由两个独立的层构建,每个层占据 108dp x 108dp 的画布:背景层和前景层。 Android 将两者组合在一起,然后应用当前启动器使用的任何遮罩形状,无论是圆形、圆角正方形、泪滴形还是其他形状。两层结构也使得 Android 能够添加微妙的视差和运动效果,因为当您点击或拖动图标时,各层可以独立移动。

在应用程序的资源中,这通常是通过像 mipmap-anydpi-v26/ic_launcher.xml 这样的 XML 文件定义的,它只是指向背景和前景可绘制对象,而不包含像素数据本身。传统的平面 ic_launcher.png 仍然保留作为运行 Android 7.1 或更早版本的设备的后备,这些设备完全早于自适应图标系统。

为什么安全区很重要

这是最让人困惑的部分。尽管每层的画布为 108dp x 108dp,但无论应用哪种蒙版形状,都只能保证以该画布为中心的内部 66dp x 66dp 圆圈可见。该内部区域通常称为安全区。它外面的任何东西都可能会显示在圆形蒙版上,然后突然夹在更具攻击性的方格形或泪滴形蒙版上,反之亦然。

这正是当徽标靠近画布边缘绘制以最大化其视觉尺寸时出现的问题:它在圆形蒙版上看起来很完美,但在三星的方圆蒙版上剪裁不均匀。修复不是重新设计,只是稍微缩小艺术品,这样无论最终应用哪种形状,有意义的内容都保留在安全区域内。

Exploded diagram showing an adaptive icon background layer plus a foreground layer with a safe zone, combined into a final masked icon

您将遇到的启动器形状

形状你会在哪里看到它
圆圈原生 Android、Pixel 启动器(长期默认)
方格(圆角方形)Samsung One UI 和其他几种 Android 皮肤
圆角正方形(超椭圆)iOS,由系统自动应用,无需开发者控制
泪珠在某些三星软件版本上作为可选选项提供
带有柔和拐角的方形各种其他制造商启动器皮肤

实际的收获是,你无法选择你的图标最终会穿哪一种形状。使用原生 Android 启动器的用户通常甚至可以从设置菜单中选择自己喜欢的形状。你唯一真正的杠杆是确保艺术品本身优雅地保存下来,这正是安全区所保证的。

构建资产:您需要的尺寸和密度

密度桶启动器图标大小
mdpi48 x 48 像素
hdpi72 x 72 像素
xhdpi96 x 96 像素
xxhdpi144 x 144 像素
xxxhdpi192 x 192 像素
Play 商店列表图标512 x 512 像素

如果您也在 iOS 上发布该应用程序,请完全添加另一组,因为 Apple 的 App Store 图标要求最高为 1024x1024,并使用完全不同的非分层格式,根本不透明。

手动方式与使用生成器

您完全可以在图像编辑器中手动生成这些尺寸中的每一种,或者通过 Android Studio 的内置 Image Asset Studio,它可以很好地处理单个项目的密度缩放和遮罩预览。当您跨多个应用程序维护一个设计系统,需要匹配来自同一主图稿的 iOS 导出,或者只是想要一种快速方法来在提交之前仔细检查设计在每个形状上的行为方式时,这会变得乏味。

从一张主图像生成各种尺寸

我们的 应用程序图标生成器 采用单个高分辨率源图像,并生成全套 Android 密度桶、自适应图标前景/背景结构以及 Play 商店列表大小,所有这些都来自一次上传,因此您无需手动导出和重命名十几个文件。

从现有 APK 中提取图标

有时需求是相反的。也许您继承了一个没有原始设计文件的项目,或者您想在设计自己的图标之前准确了解竞争对手如何构建其图标,或者您只需从构建的 APK 中取出图标以在相关工具或营销资产中重用它。由于 APK 实际上是包含应用程序所有资源的结构化存档,因此其启动器图标文件实际上存在于其中,并且可以直接提取,而不是从头开始重建。

我们的 图标提取器 从您上传的任何 APK 中准确提取这些文件,为您提供原始开发人员提供的任何分辨率的原始图标资源,这通常是恢复丢失的源文件或研究其他应用程序如何解决相同设计问题的最快方法。

在审核中标记的常见图标错误

在发货前测试您的图标的形状

在最终确定图标之前,值得至少在圆形蒙版和方圆蒙版下并排预览它,而不是假设它会干净地翻译。正是出于这个原因,Android Studio 的 Image Asset Studio 包含了跨多个启动器形状的实时预览,并且只需要一分钟就能捕获只有在发布后才会出现的问题,当使用“错误”启动器形状的用户报告某些内容看起来不正常时。

要点

  • 自适应图标在 108dp 画布上使用两个图层:背景和前景,系统将每个启动器屏蔽为不同的形状。
  • 仅保证内部 66dp 安全区域在每个面罩形状上都可见;在里面保留有意义的艺术品。
  • 对于 Android 7.1 或更早版本的设备,您仍然需要一个扁平的旧版图标。
  • 生成器可以从一个主图像生成每种所需的密度和 Play 商店列表大小,从而节省大量的手动导出工作。
  • 当源文件丢失或您需要研究其他应用程序的资源时,可以直接从现有 APK 中提取图标。

常见问题解答 (FAQ)

Play 商店列表图标所需的实际像素大小是多少?

512x512 像素,带有 Alpha 通道的 32 位 PNG。这与 APK 本身捆绑的启动器图标大小是分开的。

我的自适应图标的背景图层是否需要为纯色?

不一定是平面颜色,但它通常应该是不透明且简单的,因为它可以以您无法完全控制的方式移动、缩放或遮盖。繁忙或透明的背景往往在启动器之间看起来不一致。

我可以直接在 iOS 上重复使用 Android 自适应图标设计吗?

不直接。 iOS 使用单个平面方形图像,并由系统应用圆角,而不是单独的图层,因此您通常会为 iOS 导出同一图稿的简化平面版本。

为什么我的图标在手机上看起来很好,但在 Play 商店列表中却很模糊?

当列表图标从小源图像放大时通常会发生这种情况。始终从至少 1024x1024 像素的主文件开始,然后导出每个所需的尺寸。

如果我跳过旧版 Android 版本的旧图标回退,会发生什么情况?

Android 7.1 或更早版本的设备不支持自适应图标,可能会回退到通用系统图标或无法正确呈现图标。仅当您的应用支持的最低 Android 版本为 8.0 或更高版本时,才可以安全地跳过。

你不需要任何设计理论的背景,只需要意识到你的图标将在它离开你的手时以你无法控制的方式被重塑。为安全区进行设计,保留遗留后备,从一个干净的主文件生成每个所需的尺寸,并且无论您的图标位于哪个启动器上,它都将保持不变。

由 Shaefale 女士设计并记录 首席开发人员和 Android 包架构师 • 在 Android 12–15 上经过验证

Mst Shaefale 在 xapktoapk.com 维护客户端 XAPK/APKS 合并、二进制清单解析器和 APK v1+v2 签名工具。发现过时的命令或操作系统更改?发送编辑说明。