导航编辑器

Android Studio 包含一个 GUI，可用于创建和编辑导航图。这本质上是底层 XML 资源文件的编辑器。

概述

在将 XML 图添加到应用后，Android Studio 会在导航编辑器中打开该图。在导航编辑器中，您可以直观地编辑导航图或直接编辑底层 XML。

目标面板：列出您的导航主机和图编辑器中的所有目标。
图编辑器：包含导航图的直观表示。您可以在设计视图和底层 XML 表示的文本视图之间切换。
属性：显示导航图中所选项目的属性。

单击文本选项卡以查看相应的 XML，它应该类似于以下代码段

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/nav_graph">

</navigation>

<navigation> 元素是导航图的根元素。当您向图中添加目标和连接操作时，您可以在这里看到相应的 <destination> 和 <action> 元素作为子元素。如果您有嵌套图，它们将显示为子 <navigation> 元素。

添加目标

您可以从现有的片段或活动创建目标。您还可以使用导航编辑器创建新目标，或创建占位符，以后再用片段或活动替换。

此示例演示如何创建新目标。要使用导航编辑器添加新目标，请执行以下操作

在导航编辑器中，单击新建目标图标，然后单击创建新目标。
在出现的新建 Android 组件对话框中，创建您的片段。有关片段的更多信息，请参阅片段概述.

回到导航编辑器，注意 Android Studio 已将此目的地添加到图表中。

图 2 显示了一个目的地和一个占位符目的地的示例。

有关将目的地添加到导航图的其他方法，请参阅其他目的地。

从现有片段或活动创建目的地

在导航编辑器中，如果您有想要添加到导航图的现有目的地类型，请单击 **新建目的地** 。

接下来，单击出现的下拉菜单中相应的目的地。您现在可以在 **设计** 视图中看到目的地的预览，以及导航图的 **文本** 视图中的相应 XML。

创建新的片段目的地

要使用导航编辑器添加新的目的地类型，请执行以下操作

在导航编辑器中，单击 **新建目的地** 图标。

接下来，单击 **创建新的目的地**。
在出现的 **新建 Android 组件** 对话框中，创建您的片段。

回到导航编辑器，注意 Android Studio 已将此目的地添加到图表中。

图 3 显示了一个目的地和一个占位符目的地的示例。

目的地的构成

单击一个目的地以选择它，并注意 **属性** 面板中的以下属性

**类型** 字段指示目的地是在您的源代码中作为片段、活动还是其他自定义类实现的。
**标签** 字段包含目的地的用户可读名称。这可能显示在 UI 上，例如，如果您将 NavGraph 连接到 Toolbar 使用 setupWithNavController()。因此，对于此值，请使用资源字符串。
**ID** 字段包含目的地 ID，用于在代码中引用目的地。
**类** 下拉菜单显示与目的地关联的类的名称。单击此下拉菜单可将关联的类更改为其他目的地类型。

单击 **文本** 选项卡以显示导航图的 XML 视图。XML 包含与以下代码段中相同的目的地的 id、name、label 和 layout 属性

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    app:startDestination="@id/blankFragment">
    <fragment
        android:id="@+id/blankFragment"
        android:name="com.example.cashdog.cashdog.BlankFragment"
        android:label="@string/label_blank"
        tools:layout="@layout/fragment_blank" />
</navigation>

NavHostFragment

您也可以使用布局编辑器将 NavHostFragment 添加到活动，方法是执行以下操作

在您的项目文件列表中，双击您活动的布局 XML 文件以在布局编辑器中打开它。
在 **调色板** 面板中，选择 **容器** 类别；或者，搜索“NavHostFragment”。
将 NavHostFragment 视图拖放到您的活动上。
在出现的 **导航图** 对话框中，选择要与此 NavHostFragment 关联的相应导航图，然后单击 **确定**。

连接目的地

操作是目的地之间的逻辑连接。操作在导航图中以箭头表示。操作通常将一个目的地连接到另一个目的地，尽管您也可以创建全局操作，这些操作可以将您从应用程序中的任何位置带到特定目的地。

使用操作，您正在表示用户可以通过应用程序采取的不同路径。请注意，要实际导航到目的地，您仍然需要编写代码来执行导航。

您可以使用导航编辑器通过执行以下操作来连接两个目的地

在 **设计** 选项卡中，将指针悬停在要让用户从其导航的目的地右侧。目的地右侧会出现一个圆圈，如图 4 所示。

图 4. 带有操作连接圆圈的目的地
将光标拖动到要让用户导航到的目的地，然后释放。两个目的地之间的结果线表示一个操作，如图 5 所示。

图 5. 使用操作连接目的地
单击箭头以突出显示操作。以下属性将显示在 **属性** 面板中
- **类型** 字段包含“操作”。
- **ID** 字段包含操作的 ID。
- **目的地** 字段包含目的地片段或活动的 ID。

单击 **文本** 选项卡以切换到 XML 视图。现在，操作元素已添加到源目的地。该操作具有一个 ID 和一个目的地属性，该属性包含下一个目的地的 ID，如以下示例所示

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
   xmlns:tools="http://schemas.android.com/tools"
   xmlns:android="http://schemas.android.com/apk/res/android"
   app:startDestination="@id/blankFragment">
   <fragment
       android:id="@+id/blankFragment"
       android:name="com.example.cashdog.cashdog.BlankFragment"
       android:label="@string/label_blank"
       tools:layout="@layout/fragment_blank" >
       <action
           android:id="@+id/action_blankFragment_to_blankFragment2"
           app:destination="@id/blankFragment2" />
   </fragment>
   <fragment
       android:id="@+id/blankFragment2"
       android:name="com.example.cashdog.cashdog.BlankFragment2"
       android:label="@string/label_blank_2"
       tools:layout="@layout/fragment_blank_fragment2" />
</navigation>

在您的导航图中，操作由 <action> 元素表示。至少，一个操作包含其自己的 ID 和用户应被带到的目的地的 ID。

占位符目的地

您可以使用 占位符 来表示未实现的目的地。占位符用作目的地的可视化表示。在导航编辑器中，您可以像使用任何其他目的地一样使用占位符。