更改应用图标

1. 开始之前

应用图标是通过添加独特的样式和外观来区分您的应用的重要方式。应用图标出现在多个位置，包括主屏幕、所有应用屏幕和设置应用。

您可能还会听到应用图标被称为 **启动器** 图标。启动器指的是您在 Android 设备上点击主屏幕按钮以查看和整理您的应用、添加小部件和快捷方式等时的体验。

如果您使用过不同的 Android 设备，您可能已经注意到启动器体验可能有所不同，具体取决于设备制造商。有时，设备制造商会创建自定义启动器体验，这是他们品牌的标志。例如，不同的制造商可能以不同的形状显示应用图标，而不是上面显示的圆形图标形状。

例如，他们可能会以方形、圆角方形或圆角方形（介于方形和圆形之间）显示所有应用图标。

无论设备制造商选择哪种形状，目标都是让单个设备上的所有应用图标都具有统一的形状，以提供一致的用户体验。

这就是 Android 平台引入对 **自适应图标** 支持的原因（从 API 级别 26 开始）。通过为您的应用实现自适应图标，您的应用能够适应各种设备，通过根据设备的显示屏调整启动器图标来实现。

此代码实验室为您提供了 **Affirmations** 应用启动器图标的图像源文件。您将使用 Android Studio 中的一个工具（称为 **图像资产工作室**）来生成启动器图标的不同版本。之后，您可以将学到的知识应用于其他应用的应用图标！

先决条件

能够浏览基本 Android 项目的文件，包括资源文件。
能够从 Android Studio 在模拟器或物理设备上安装 Android 应用。

您将学到什么

如何更改应用的启动器图标。
如何在 Android Studio 中使用图像资产工作室来生成启动器图标资产。
自适应图标是什么以及为什么它是两层。

您将制作什么

**Affirmations** 应用的自定义启动器图标。

您需要什么

安装了最新稳定版本的 Android Studio 的计算机。
用于下载图像资源文件的互联网连接。
访问 GitHub

下载入门代码

在 Android Studio 中，打开 basic-android-kotlin-compose-training-affirmations 文件夹。

导航到项目的 GitHub 存储库页面。
验证分支名称是否与代码实验室中指定的分支名称匹配。例如，在以下屏幕截图中，分支名称为 **main**。

在项目的 GitHub 页面上，点击 **Code** 按钮，这将弹出一个弹出窗口。

在弹出窗口中，点击 **Download ZIP** 按钮将项目保存到您的计算机上。等待下载完成。
在您的计算机上找到该文件（可能在 **Downloads** 文件夹中）。
双击 ZIP 文件将其解压缩。这将创建一个包含项目文件的新文件夹。

在 Android Studio 中打开项目

启动 Android Studio。
在 **Welcome to Android Studio** 窗口中，点击 **Open**。

注意：如果 Android Studio 已经打开，请改为选择 **File** > **Open** 菜单选项。

在文件浏览器中，导航到解压缩的项目文件夹所在的目录（可能在您的 **Downloads** 文件夹中）。
双击该项目文件夹。
等待 Android Studio 打开项目。
点击 **Run** 按钮来构建和运行应用。确保它按预期构建。

2. 启动器图标

目标是让您的启动器图标看起来清晰锐利，无论设备型号或屏幕密度如何。屏幕密度指的是屏幕上每英寸有多少像素或每英寸点数（dpi）。对于中等密度设备 (mdpi)，屏幕上每英寸有 160 个点，而超超超高密度设备 (xxxhdpi) 每英寸有 640 个点。

为了解决各种屏幕密度的设备，您需要提供应用图标的不同版本。

探索启动器图标文件

要查看项目中的启动器图标是什么样的，请在 Android Studio 中打开项目。
在 **Project window** 中，切换到 **Project** 视图。这将显示项目的目录结构。

导航到资源目录（**app > src > main > res**）并展开一些 mipmap 文件夹。这些 mipmap 文件夹是您将放置 Android 应用的启动器图标资产的位置。

drawable 文件夹包含启动器图标在 XML 文件中的矢量。在 drawable 图标的情况下，矢量是一系列绘制图像时执行的指令。 mdpi、hdpi、xhdpi 等是密度限定符，您可以将其附加到资源目录的名称（例如 mipmap,）上，以指示它们是针对特定屏幕密度的设备的资源。下面列出了 Android 上的密度限定符

mdpi - 针对中等密度屏幕（~160 dpi）的资源
hdpi - 针对高密度屏幕（~240 dpi）的资源
xhdpi - 针对超高密度屏幕（~320 dpi）的资源
xxhdpi - 针对超超高密度屏幕（~480 dpi）的资源
xxxhdpi - 针对超超超高密度屏幕（~640 dpi）的资源
nodpi - 无论屏幕像素密度如何，都不应该缩放的资源
anydpi - 针对任何密度的资源

如果您点击图像文件，您将看到预览。 ic_launcher.webp 文件包含图标的方形版本，而 ic_launcher_round.webp 文件包含图标的圆形版本。两者都提供在每个 mipmap 目录中。

例如，这就是 **res > mipmap-xxxhdpi > ic_launcher_round.webp** 的样子。请注意，资产的大小在右上角。这张图片的大小是 192px x 192px。

这就是 **res > mipmap-mdpi > ic_launcher_round.webp** 的样子。它的大小只有 48px x 48px。

如您所见，这些位图图像文件由固定的像素网格组成。它们是为特定的屏幕分辨率创建的。因此，当您调整它们的大小后，质量会下降。

现在您已经了解了一些关于启动器图标的背景知识，您将了解自适应图标。

3. 自适应图标

前台和后台层

从 Android 8.0 版本（API 级别 26）开始，支持自适应图标，这提供了更大的灵活性以及更有趣的视觉效果。对于开发者来说，这意味着您的应用图标由两层组成：前台层和后台层。

在上面的示例中，白色的 Android 图标位于前台层，而蓝色和白色的网格位于后台层。前台层叠加在后台层之上。然后在顶部应用一个蒙版（在本例中为圆形蒙版）以生成圆形应用图标。

探索自适应图标文件

查看 **Affirmations** 应用代码中已提供的默认自适应图标文件。

在 Android Studio 的 **Project window** 中，找到并展开 **res > mipmap-anydpi-v26** 资源目录。

打开 ic_launcher.xml 文件。您将看到以下内容

<?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"/>
    <monochrome android:drawable="@drawable/ic_launcher_foreground"/>
</adaptive-icon>

请注意如何使用 <adaptive-icon> 元素通过提供每个层的资源可绘制对象来声明应用图标的 <background> 和 <foreground> 层。
返回到**项目**视图并找到背景和前景可绘制对象：res > drawable > ic_launcher_background.xml 和 res > drawable > ic_launcher_foreground.xml。
切换到**设计**视图以查看每个可绘制对象的预览。

背景

前景

这两个都是矢量可绘制文件。它们没有固定的像素大小。如果切换到**代码**视图，可以使用 `<vector>` 元素查看矢量可绘制对象的 XML 声明。

ic_launcher_foreground.xml

<!--
    Copyright (C) 2023 The Android Open Source Project

    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at

         https://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an "AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.
-->

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:aapt="http://schemas.android.com/aapt"
    android:width="108dp"
    android:height="108dp"
    android:viewportWidth="108"
    android:viewportHeight="108">
  <path android:pathData="M31,63.928c0,0 6.4,-11 12.1,-13.1c7.2,-2.6 26,-1.4 26,-1.4l38.1,38.1L107,108.928l-32,-1L31,63.928z">
    <aapt:attr name="android:fillColor">
      <gradient
          android:endX="85.84757"
          android:endY="92.4963"
          android:startX="42.9492"
          android:startY="49.59793"
          android:type="linear">
        <item
            android:color="#44000000"
            android:offset="0.0" />
        <item
            android:color="#00000000"
            android:offset="1.0" />
      </gradient>
    </aapt:attr>
  </path>
  <path
      android:fillColor="#FFFFFF"
      android:fillType="nonZero"
      android:pathData="M65.3,45.828l3.8,-6.6c0.2,-0.4 0.1,-0.9 -0.3,-1.1c-0.4,-0.2 -0.9,-0.1 -1.1,0.3l-3.9,6.7c-6.3,-2.8 -13.4,-2.8 -19.7,0l-3.9,-6.7c-0.2,-0.4 -0.7,-0.5 -1.1,-0.3C38.8,38.328 38.7,38.828 38.9,39.228l3.8,6.6C36.2,49.428 31.7,56.028 31,63.928h46C76.3,56.028 71.8,49.428 65.3,45.828zM43.4,57.328c-0.8,0 -1.5,-0.5 -1.8,-1.2c-0.3,-0.7 -0.1,-1.5 0.4,-2.1c0.5,-0.5 1.4,-0.7 2.1,-0.4c0.7,0.3 1.2,1 1.2,1.8C45.3,56.528 44.5,57.328 43.4,57.328L43.4,57.328zM64.6,57.328c-0.8,0 -1.5,-0.5 -1.8,-1.2s-0.1,-1.5 0.4,-2.1c0.5,-0.5 1.4,-0.7 2.1,-0.4c0.7,0.3 1.2,1 1.2,1.8C66.5,56.528 65.6,57.328 64.6,57.328L64.6,57.328z"
      android:strokeWidth="1"
      android:strokeColor="#00000000" />
</vector>

虽然矢量可绘制对象和位图图像都描述了图形，但它们之间存在重要区别。

位图图像对它所保存的图像了解不多，除了每个像素的颜色信息。另一方面，矢量图形知道如何绘制定义图像的形状。这些指令由一组点、线和曲线以及颜色信息组成。优点是矢量图形可以为任何画布大小、任何屏幕密度进行缩放，而不会损失质量。

矢量可绘制对象是 Android 对矢量图形的实现，旨在在移动设备上灵活使用。你可以在 XML 中使用这些可能的元素来定义它们。无需为所有密度桶提供位图资源的版本，只需要定义一次图像即可。因此，减少了应用程序的大小，并使维护更加容易。

现在该开始实际更改应用程序图标了！

4. 下载新资源

下载以下两个新资源，它们使你能够为**Affirmations**应用程序创建自适应图标。你不必担心理解矢量可绘制文件的所有细节。它们的内容是从设计工具自动为你生成的。

下载 ic_launcher_background.xml，它是背景层的矢量可绘制对象。如果浏览器显示文件而不是下载它，请选择**文件 > 另存为...**将其保存到你的计算机上。
下载 ic_launcher_foreground.xml，它是前景层的矢量可绘制对象。

请注意，这些前景和背景层资源有一些特定要求，例如，两者的大小都必须为 108 dpi x 108 dpi。你可以在 AdaptiveIconDrawable 文档中查看更多详细信息，还可以查看 Android 图标在 Material Design 网站上的设计指南。

由于图标的边缘可能会被剪裁，具体取决于设备制造商提供的掩码的形状，因此将图标的关键信息放在“安全区域”中很重要。安全区域是前景层中心直径为 66 dpi 的圆形区域。安全区域之外的内容不应是必要的，例如背景颜色，如果被剪裁是可以的。

5. 更改应用程序图标

返回 Android Studio 以使用你刚刚下载的新资源。

首先，删除包含 Android 图标和绿色网格背景的旧可绘制资源。在**项目视图**中，右键单击该文件并选择**删除**。

删除

drawable/ic_launcher_background.xml
drawable/ic_launcher_foreground.xml

删除

mipmap-anydpi-v26/
mipmap-hdpi/
mipmap-mdpi/
mipmap-xhdpi/
mipmap-xxhdpi/
mipmap-xxxhdpi/

你可以取消选中**安全删除（使用搜索）**框，然后单击**确定**。**安全删除（使用搜索）**功能在代码中搜索你即将删除的资源的使用情况。在本例中，你将用相同名称的新文件夹替换这些文件夹，因此你不必担心**安全删除**。

创建一个新的**图像资源**。你可以右键单击**res**目录并选择**新建 > 图像资源**，也可以单击**资源管理器**选项卡，单击**+**图标，然后从下拉菜单中选择**图像资源**。

Android Studio 的**图像资源工作室**工具将打开。
保留默认设置

**图标类型：**启动器图标（自适应和传统）
**名称：**ic_launcher

在**前景层**选项卡已选择的情况下，转到**源资源**子部分。在**路径**字段中，单击文件夹图标。
将弹出一个提示，让你浏览计算机并选择文件。找到你刚刚下载的新 ic_launcher_foreground.xml 文件的位置。它可能在你的计算机的**下载**文件夹中。找到它后，单击**打开**。
**路径**现在已使用新前景矢量可绘制对象的位置更新。将**层名称**保留为**ic_launcher_foreground**，将**资源类型**保留为**图像**。

接下来，切换到界面的**背景层**选项卡。保留默认值。
单击**路径**字段中的文件夹图标。
找到你刚刚下载的 ic_launcher_background.xml 文件的位置。单击**打开**。

预览应该会在你选择新资源文件时更新。这是使用新的前景和背景层时的外观。

通过以两层表示你的应用程序图标，设备制造商（称为原始设备制造商或 OEM）可以根据 Android 设备创建不同的形状，如上图预览所示。OEM 提供了一个掩码，该掩码将应用于设备上的所有应用程序图标。

当将圆形掩码应用于应用程序图标的两层时，结果将是一个圆形图标，其中包含一个 Android 图像和一个蓝色网格背景（上图左）。或者，可以应用一个圆角方形掩码来生成上面右边的应用程序图标。

拥有前景和背景层可以实现有趣的视觉效果，因为这两层可以独立移动，并且可以缩放。有关视觉效果外观的一些有趣示例，请查看设计自适应图标博文，了解设计注意事项。由于你不知道用户的设备是什么，或者 OEM 将对图标应用什么掩码，因此你需要设置自适应图标，以确保重要信息不会被剪裁。

如果重要内容被剪裁或显示太小，则可以使用每层**缩放**部分下的**调整大小**滑块来确保所有内容都显示在安全区域中。为了确保没有被剪裁，将前景和背景图像调整为 99%，方法是在**前景层**和**背景层**选项卡中拖动**调整大小**滑块。

单击**下一步**。
此步骤用于**确认图标路径**。你可以单击各个文件以查看预览。

单击**完成**。
验证所有生成的资源在 mipmap 文件夹中是否正确。示例

干得好！现在你将进行最后一个更改。

测试你的应用程序

测试新应用程序图标是否出现。在你的设备（模拟器或物理设备）上运行应用程序。
按下设备上的**主页**按钮。
向上滑动以显示**所有应用程序**列表。
查找你刚刚更新的应用程序。你应该看到显示的新应用程序图标。

做得好！新的应用程序图标看起来很棒。

自适应和传统启动器图标

现在你的自适应图标运行良好，你可能想知道为什么你不能删除所有应用程序图标位图图像。你仍然需要这些文件，以便你的应用程序图标在较旧版本的 Android 上以高品质显示，这被称为向后兼容性。

对于运行**Android 8.0 或更高版本**（API 版本 26 及更高版本）的设备，可以使用**自适应图标**（前景矢量可绘制对象、背景矢量可绘制对象的组合，上面应用了 OEM 掩码）。这些是项目中相关文件

res/drawable/ic_launcher_background.xml
res/drawable/ic_launcher_foreground.xml
res/mipmap-anydpi-v26/ic_launcher.xml
res/mipmap-anydpi-v26/ic_launcher_round.xml

在运行**Android 8.0 以下**版本（但高于应用程序所需的最低 API 级别）的设备上，将使用**传统启动器图标**（位于不同密度桶的 mipmap 文件夹中的位图图像）。这些是项目中相关文件

res/mipmap-mdpi/ic_launcher.webp
res/mipmap-mdpi/ic_launcher_round.webp
res/mipmap-hdpi/ic_launcher.webp
res/mipmap-hdpi/ic_launcher_round.webp
res/mipmap-xhdpi/ic_launcher.png
res/mipmap-xhdpi/ic_launcher_round.webp
res/mipmap-xxhdpi/ic_launcher.webp
res/mipmap-xxhdpi/ic_launcher_round.webp
res/mipmap-xxxhdpi/ic_launcher.webp
res/mipmap-xxxhdpi/ic_launcher_round.webp

从本质上讲，Android 在没有自适应图标支持的较旧设备上回退到位图图像。

恭喜你，你完成了更改应用程序图标的所有步骤！

6. 获取解决方案代码

要下载完成的 codelab 的代码，你可以使用以下 git 命令

$ git clone https://github.com/google-developer-training/basic-android-kotlin-compose-training-affirmations.git
$ cd basic-android-kotlin-compose-training-affirmations
$ git checkout main

或者，你可以将存储库下载为 zip 文件，解压缩它，并在 Android Studio 中打开它。

如果你想查看解决方案代码，在 GitHub 上查看它.

导航到项目的 GitHub 存储库页面。
验证分支名称是否与代码实验室中指定的分支名称匹配。例如，在以下屏幕截图中，分支名称为 **main**。

在项目的 GitHub 页面上，点击 **Code** 按钮，这将弹出一个弹出窗口。

在弹出窗口中，点击 **Download ZIP** 按钮将项目保存到您的计算机上。等待下载完成。
在您的计算机上找到该文件（可能在 **Downloads** 文件夹中）。
双击 ZIP 文件将其解压缩。这将创建一个包含项目文件的新文件夹。

在 Android Studio 中打开项目

启动 Android Studio。
在 **Welcome to Android Studio** 窗口中，点击 **Open**。

注意：如果 Android Studio 已经打开，请改为选择 **File** > **Open** 菜单选项。

在文件浏览器中，导航到解压缩的项目文件夹所在的目录（可能在您的 **Downloads** 文件夹中）。
双击该项目文件夹。
等待 Android Studio 打开项目。
点击 **Run** 按钮来构建和运行应用。确保它按预期构建。

7. 总结

将应用程序图标文件放在 mipmap 资源目录中。
在每个密度桶 (mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi) 中提供应用程序图标位图图像的不同版本，以实现与较旧版本的 Android 向后兼容。
在资源目录上添加资源限定符，以指定应在具有特定配置的设备上使用的资源 (v24 或 v26)。
矢量可绘制对象是 Android 对矢量图形的实现。它们在 XML 中定义为一组点、线和曲线，以及相关的颜色信息。矢量可绘制对象可以为任何密度进行缩放，而不会损失质量。
自适应图标是在 API 26 中引入 Android 平台的。它们由前景和背景层组成，这些层遵循特定要求，以确保你的应用程序图标在各种具有不同 OEM 掩码的设备上都能以高品质显示。
使用 Android Studio 中的**图像资源工作室**为你的应用程序创建传统和自适应图标。

更改应用图标

1. 开始之前

先决条件

您将学到什么

您将制作什么

您需要什么

下载入门代码

在 Android Studio 中打开项目

2. 启动器图标

探索启动器图标文件

3. 自适应图标

前台和后台层

探索自适应图标文件

4. 下载新资源

5. 更改应用程序图标

测试你的应用程序

自适应和传统启动器图标

6. 获取解决方案代码

在 Android Studio 中打开项目

7. 总结

8. 了解更多信息