Android：通过navigation实现fragment跳转

官网教程：https://developer.android.com/guide/navigation/navigation-getting-started

1. 配置环境

步骤：

1. 使用Navigation需要向build.gradle(Module:test.app)添加下列依赖项，点击上述官网可以查看最新的版本。
   
2. 因为我用的是Java，因此添加对应的Java版就行，即

dependencies {
  def nav_version = "2.3.5"

  // Java language implementation
  implementation "androidx.navigation:navigation-fragment:$nav_version"
  implementation "androidx.navigation:navigation-ui:$nav_version"
}

3. Sync Now
   

2. 创建导航图

步骤：

1. 在“Project”窗口中，右键点击 res 目录，然后依次选择 New > Android Resource File。此时系统会显示 New Resource File 对话框。
2. 在 File name 字段中输入名称，例如：“nav_graph”。然后从 Resource type 下拉列表中选择 Navigation，然后点击 OK。

创建导航图之后，Android Studio 会在 res 目录内创建一个 navigation 资源目录。该目录包含相关的导航图资源文件（例如 nav_graph.xml）。

3. 创建Fragment

步骤：

1. 在“Project”窗口中，右键点击 java 目录，然后依次选择 New > Fragment > Fragment(Blank)。
   
2. 输入Fragment Name，点击Finish。
   
3. 为了后续演示，这里会创建3个Fragment，分别是StartFragment，MidFragment和FinalFragment。
4. 以StartFragment为例，修改布局，加入Button。（其他的两个Fragment布局一样就是颜色不一样）
5. 修改.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".StartFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:id="@+id/text_start"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="StartFragment"
        android:gravity="center"
        android:background="#EAA1BA"
        android:textAppearance="@style/TextAppearance.AppCompat.Display1"
        />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_gravity="center_horizontal|bottom"
        >

        <Button
            android:id="@+id/btn_next"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="上一步"
            />

        <Button
            android:id="@+id/btn_pre"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:text="下一步"
            />
    </LinearLayout>
    
</FrameLayout>

效果图：

4. 向 Activity 中添加NavHostFragment

步骤：

1. 在项目文件列表中，双击 Activity 的布局 XML 文件，即activity_main.xml，以在 Layout Editor 中将其打开。
2. 选择“Design”，然后删除ConstraintLayout里面的TextView。（如果还有其他布局，可以一起删掉）
   
3. 在 Palette 窗格内，选择 Containers 类别，或者搜索“NavHostFragment”，然后将其拖放到ConstraintLayout中，然后点击右边四个蓝色的加号，将fragment的四条边约束到activity上。
   
   将“NavHostFragment”拖放到ConstraintLayout时，会出现下列选项，左边的nav_graph即是之前创建的那个导航图，选择它，点击OK。
   
   然后可以看到.xml文件中出现了相应的code：
   

5. 向导航图中添加目的地

步骤：

1. 点击之前创建的nav_graph.xml文件，选择“Design”，点击 New Destination 图标，然后从中选择我们之前创建的Fragment。
   
2. 将需要创建链接的fragment添加到导航图中。
   
   可以看到右侧Attributes面板中显示了3个属性：

• id：字段包含该目的地的 ID，它用于在代码中引用该目的地。
• label：字段包含该目的地的 XML 布局文件的名称。
• name：字段包含该目的地的 Java 文件名称。

6. 连接目的地

步骤：

1. 在 Design 标签页中，将鼠标悬停在目的地的右侧，该目的地右侧上方会显示一个圆圈：
   
2. 点击你希望这个fragment指向的目的地，并将光标拖动到该目的地的上方，然后松开。这两个目的地之间生成的线条表示操作：
   
3. 点击这个箭头，可以看到右侧面板上有两个属性：

• id：字段包含该操作的 ID。
• destination：字段包含该操作的目的地。
  

7. 实现fragment跳转

导航到目的地是使用 NavController 完成的，它是一个在 NavHost 中管理应用导航的对象。每个 NavHost 均有自己的相应 NavController。可以使用以下方法之一检索 NavController：

NavHostFragment.findNavController(Fragment)
Navigation.findNavController(Activity, @IdRes int viewId)
Navigation.findNavController(View)

三个fragment之间的导航图：
StartFragment 下一步 -> MidFragment
StartFragment 上一步 -> FinalFragment
其他的同理，整体逻辑：StartFragment <-> MidFragment <-> FinalFragment <-> StartFragment。

具体在代码中的实现，以StartFragment为例，在StartFragment.java中添加下面的代码：

public class StartFragment extends Fragment {
	// ... ...

    // 声明控件
    private Button mBtnPre;
    private Button mBtnNext;

    @Override
    public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);

        // 检索NavController
        final NavController navController = Navigation.findNavController(view);

        // 找到控件
        mBtnPre = view.findViewById(R.id.btn_pre);
        mBtnNext = view.findViewById(R.id.btn_next);

        mBtnPre.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // navigate中的id即是点击nav_graph.xml中的箭头时其id
                // 找到每一个操作对应的id传给navController即可实现页面跳转
                navController.navigate(R.id.action_startFragment_to_finalFragment);
            }
        });

        mBtnNext.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                navController.navigate(R.id.action_startFragment_to_midFragment);
            }
        });

    }
}

在另外两个Fragment对应的Java文件中也添加相应的代码，注意改变相应操作的id，这样就可以实现导航图中显示的页面跳转了。