更改应用图标

1. 开始之前

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

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

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

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

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

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

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

先决条件

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

您将学习的内容

• 如何更改应用的启动器图标。
• 如何在 Android Studio 中使用 Image Asset Studio 生成启动器图标资源。
• 什么是自适应图标以及为什么它有两层。

您将制作的内容

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

您需要的内容

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

下载入门代码

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

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

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

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

在 Android Studio 中打开项目

1. 启动 Android Studio。
2. 在**欢迎使用 Android Studio**窗口中，点击**打开**。

注意：如果 Android Studio 已经打开，请选择**文件**>**打开**菜单选项。

3. 在文件浏览器中，导航到解压的项目文件夹所在的位置（可能在您的**下载**文件夹中）。
4. 双击该项目文件夹。
5. 等待 Android Studio 打开项目。
6. 点击**运行**按钮来构建和运行应用。确保它按预期构建。

2. 启动器图标

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

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

浏览启动器图标文件

1. 要查看项目中启动器图标的外观，请在 Android Studio 中打开项目。
2. 在**项目窗口**中，切换到**项目**视图。这将向您显示项目的文件夹结构。

3. 导航到资源目录（**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 - 可缩放至任何密度的资源

4. 如果您点击图像文件，您将看到预览。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**应用代码中提供的默认自适应图标文件。

1. 在 Android Studio 的**项目窗口**中，找到并展开**res > mipmap-anydpi-v26** 资源目录。

2. 打开`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>

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

背景

前景

6. 这两个都是矢量可绘制文件。它们没有固定的像素大小。如果切换到**代码**视图，您可以看到使用`<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://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** 应用创建自适应图标。您无需担心理解矢量可绘制文件的每个细节。它们的内容是根据设计工具自动生成的。

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

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

由于图标的边缘可能会被剪裁，具体取决于设备制造商的蒙版形状，因此将图标的关键信息放在“安全区域”中非常重要。“安全区域”是前景层中心直径为 66 dpi 的圆圈。安全区域外的内容（例如背景颜色）不应是必要的，即使被剪裁也没关系。

5. 更改应用程序图标

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

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

删除

drawable/ic_launcher_background.xml
drawable/ic_launcher_foreground.xml

删除

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

您可以取消选中**安全删除（带用法搜索）**框并点击**确定**。**安全删除（带用法搜索）**功能会在代码中搜索您即将删除的资源的用法。在本例中，您将用同名的新文件夹替换这些文件夹，因此无需担心**安全删除**。

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

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

• **图标类型：**启动器图标（自适应和旧版）
• **名称：**ic_launcher

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

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

11. 选择新资源文件时，预览应该会更新。使用新的前景和背景层后，它应该是这样的。

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

当圆形蒙版应用于应用程序图标的两层时，结果将是具有 Android 图像和蓝色网格背景的圆形图标（上图左侧）。或者，可以应用圆角方形蒙版来生成上图右侧的应用程序图标。

拥有前景层和背景层可以产生有趣的视觉效果，因为两层可以独立移动和缩放。有关视觉效果如何显示的一些有趣示例，请查看设计自适应图标博文中的“设计注意事项”部分。因为您不知道用户的设备是什么或 OEM 将应用什么蒙版到您的图标上，所以您需要设置自适应图标，以便重要的信息不会被剪裁。

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

13. 点击**下一步**。
14. 此步骤是**确认图标路径**。您可以点击各个文件以查看预览。

15. 点击**完成**。
16. 验证所有生成的资源在`mipmap` 文件夹中是否看起来正确。示例

干得好！现在您将进行另一个更改。

测试您的应用

1. 测试您的新应用程序图标是否显示。在您的设备（模拟器或物理设备）上运行应用程序。
2. 点击设备上的**主页**按钮。
3. 向上滑动以显示**所有应用**列表。
4. 查找您刚刚更新的应用程序。您应该会看到显示新的应用程序图标。

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

自适应和旧版启动器图标

既然您的自适应图标运行良好，您可能想知道为什么您无法摆脱所有应用程序图标位图图像。您仍然需要这些文件，以便您的应用程序图标在旧版本的 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 中打开它。

file_download下载 zip

如果您想查看解决方案代码，请在 GitHub 上查看。

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

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

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

在 Android Studio 中打开项目

1. 启动 Android Studio。
2. 在**欢迎使用 Android Studio**窗口中，点击**打开**。

注意：如果 Android Studio 已经打开，请选择**文件**>**打开**菜单选项。

3. 在文件浏览器中，导航到解压的项目文件夹所在的位置（可能在您的**下载**文件夹中）。
4. 双击该项目文件夹。
5. 等待 Android Studio 打开项目。
6. 点击**运行**按钮来构建和运行应用。确保它按预期构建。

7. 总结

• 将应用程序图标文件放在`mipmap` 资源目录中。
• 为了向后兼容旧版本的Android，请为每个密度级别（mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi）提供不同版本的应用图标位图图像。
• 在资源目录上添加资源限定符，以指定应在具有特定配置（v24或v26）的设备上使用的资源。
• 矢量可绘制对象是Android对矢量图形的实现。它们在XML中定义为一组点、线和曲线，以及相关的颜色信息。矢量可绘制对象可以缩放至任何密度而不会损失质量。
• 自API 26起，自适应图标已引入Android平台。它们由遵循特定要求的前景色和背景层组成，以便您的应用图标在具有不同OEM蒙版的各种设备上看起来都高质量。
• 使用Android Studio中的**图像资源工作室**创建应用的传统图标和自适应图标。

8. 了解更多

• Android图标设计指南
• 自适应图标
• 了解Android自适应图标
• 设计自适应图标
• 实现自适应图标
• 自适应图标 Playground 应用
• 创建自适应和传统启动器图标
• 支持不同的像素密度
• 将应用图标放在mipmap目录中
• 矢量可绘制对象概述
• VectorDrawable 类