前言

开个新坑，上回秋招的时候已经会开始问一些关于Jetpack的一些问题了，然而碰都没碰过，前段时间开始学习，发现网上的质量参差不齐，基本就是照着官网的，还是自己来记录吧，本篇文章将会记录自己学习Jetpack架构组件中Navigation组件的基本使用。

Navigation介绍

首先我们看看Navigation到底是啥，一般查阅资料，我们最权威的还是要从官方文档看起，建议先看一遍视频：

导航介绍页面

Navigation的可视化，第一次看到惊呆了

Navigation的基本使用

还是老样子，我们根据官方开发文档来看，但是开发文档写的挺难懂的，所以这里再按我自己的理解来使用。
首先要使用Navigation需要build.gradle 文件添加以下依赖项（具体版本根据开发文档来查看）：

implementation 'androidx.navigation:navigation-fragment:2.2.0'
implementation 'androidx.navigation:navigation-ui:2.2.0'

然后我们就需要创建一个Navigation了，我们在res文件夹下右键新建一个Android Resource File，名字输入nav_grap，在Resource type类型里面选择Navigation，然后我们就可以看到res文件夹下面有一个新建的navigation文件夹和已经创建好的Navigation了。

Navigation界面

中间一大框框的就是导航图了，也就是可视化界面，左边主要展示这个Navigation的宿主（具体是啥后面再说）和Navigation导航的Fragment。接着我们在创建两个Fragment，名字随意。

Fragment创建

Navigation按钮

这时候我们会看到你创建的Fragmt和Activity，我们双击进行全部添加，至于placeholder这个其实就是占位符的意思，我们暂且别管。

添加Fragment

添加完成

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/nav_graph"
    app:startDestination="@id/oneFragment"
    tools:ignore="UnusedNavigation">
    <fragment
        android:id="@+id/oneFragment"
        android:name="com.ju.navigationdemo.OneFragment"
        android:label="fragment_one"
        tools:layout="@layout/fragment_one" />
    <fragment
        android:id="@+id/twoFragment"
        android:name="com.ju.navigationdemo.TwoFragment"
        android:label="fragment_two"
        tools:layout="@layout/fragment_two" />
    <activity
        android:id="@+id/mainActivity2"
        android:name="com.ju.navigationdemo.MainActivity"
        android:label="activity_main"
        tools:layout="@layout/activity_main" />
</navigation>

看到这里用过Fragment的静态使用方法的人也就明白了，也就是静态添加了Fragment和Activity，接着我们回到视图模式，选型一个Fragment，我们发现它的右边有一个小圆球，这个就是连接的意思，我们可以通过这个小圆球来进行对想要的Fragment的进行跳转等操作，只要拉动这个小圆球选定你要导航的Fragment就好了，我们导航到第二个Fragment，在切换到text模式查看代码。

Navigation连接

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/nav_graph"
    app:startDestination="@id/oneFragment"
    tools:ignore="UnusedNavigation">
    <fragment
        android:id="@+id/oneFragment"
        android:name="com.ju.navigationdemo.OneFragment"
        android:label="fragment_one"
        tools:layout="@layout/fragment_one" >
        <action
            android:id="@+id/action_oneFragment_to_twoFragment"
            app:destination="@id/twoFragment" />
    </fragment>
    <fragment
        android:id="@+id/twoFragment"
        android:name="com.ju.navigationdemo.TwoFragment"
        android:label="fragment_two"
        tools:layout="@layout/fragment_two" />
    <activity
        android:id="@+id/mainActivity2"
        android:name="com.ju.navigationdemo.MainActivity"
        android:label="activity_main"
        tools:layout="@layout/activity_main" />
</navigation>

你会发现多了一个action标签，这就是，里面两个属性一个是id（这个很重要），另一个app:destination这个属性就是要导航的Fragmen的id。接着我们回到视图模式，点击Activity，发现Activity是没有这个小圆球的，这也就是说Navigation组件不支持Activity的导航，它主要是管理Fragment的，那么我们就右击删除这个Activity吧。

接着我们需要一个宿主来存放这个Navigation，我们就给他放在MainActivity的布局下（其实就是单Activity+多Fragment的模式）：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <fragment
        android:id="@+id/container"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        app:navGraph="@navigation/nav_graph" />

</androidx.constraintlayout.widget.ConstraintLayout>

这里的name是指定 Fragment 的类型为NavHostFragment，这个就是Navigation的实现类，类型是Fragment，而defaultNavHost是让Navigation容器处理返回事件，在 Navigation 容器中如果有页面的跳转，点击返回按钮会先处理 容器中 Fragment 页面间的返回，处理完容器中的页面，再处理 Activity 页面的返回。如果值为 false 则直接处理 Activity 页面的返回。最重要的是navGraph这个属性，它就是指定Navigation文件。

接下来就是处理跳转事件了，官方文档说是可以通过以下方法来进行实现：

处理导航事件

写的有点含糊，其实就是通过这个Navigation找到它的Controller来进行跳转操作。我们在第一个Fragment的布局文件中一个Button，然后对这个Button进行控件的跳转。。。

public class OneFragment extends Fragment {


    public OneFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_one, container, false);
        initView(view);
        return view;
    }

    private void initView(View view) {
        view.findViewById(R.id.test).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //进行跳转
                Navigation.findNavController(v).navigate(R.id.action_oneFragment_to_twoFragment);
            }
        });
    }
}

如果是回退的话则是：

Navigation.findNavController(v).navigateUp();

如果是要传递数据给Fragment的话，可以通过Bundle进行传递：

Bundle bundle = new Bundle();
bundle.putInt("test",1);
//进行跳转
Navigation.findNavController(v).navigate(R.id.action_oneFragment_to_twoFragment,bundle);
//进行接收
Bundle bundle = getArguments();

运行结果

然后我们发现一个问题，没有跳转动画，其实我们也可以在Navigation的可视化界面进行设置，点击连接的那跟线，然后在右边的Animations中就可以进行设置了，然后在text模式也会成成相应的代码。

设置跳转动画

//要跳转的action标签会自动生成，也可以自定义anim
<action
            android:id="@+id/action_oneFragment_to_twoFragment"
            app:destination="@id/twoFragment"
            app:enterAnim="@anim/fragment_open_enter"
            app:exitAnim="@anim/fragment_open_exit"
            app:popEnterAnim="@anim/fragment_open_enter"
            app:popExitAnim="@anim/fragment_open_exit" />

Navigation + BottomNavigationView构建导航栏

如果只是最基本的使用那就没意思了，其实这个Navigation是可以配合BottomNavigationView做出导航栏的效果的，BottomNavigationView是谷歌推出的一个底部导航栏的控件，一般是配合Fragment来一起使用的，而且在官网案例中也有这样的使用方法。

新建工程中的Bottom Navigation Activity就是这种方法

我们就自己来实现一个，首先我们在刚刚工程的基础上在创建一个Fragment，这样就是三个Fragment了。

工程项目如图

然后我们在Navigation中把连接的线去掉，并且把第3个Fragment也添加进去。

添加3个Fragment

接着在MainActivity的布局中添加BottomNavigationView：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <fragment
        android:id="@+id/container"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_weight="9"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:navGraph="@navigation/nav_graph" />


    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_view"
        android:layout_width="match_parent"
        android:layout_weight="1"
        android:layout_height="0dp"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

</LinearLayout>

BottomNavigationView的menu如下：

//icon随意，id要和Navigation里面3个Fragmet的id要对应！！！！！！！！！！！！
<menu xmlns:android="http://schemas.android.com/apk/res/android">

<item
    android:id="@+id/oneFragment"
    android:icon="@drawable/ic_home_black_24dp"
    android:title="一" />

<item
    android:id="@+id/twoFragment"
    android:icon="@drawable/ic_dashboard_black_24dp"
    android:title="二" />

<item
    android:id="@+id/threeFragment"
    android:icon="@drawable/ic_notifications_black_24dp"
    android:title="三" />

</menu>

然后在MainActivity输入以下代码：

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //获得BottomNavigationView
        BottomNavigationView navView = findViewById(R.id.nav_view);
        //获得Navigation的Control
        NavController navController = Navigation.findNavController(this,R.id.container);
        //绑定
        NavigationUI.setupWithNavController(navView,navController);
        //获取顶部appBar
        AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(
                R.id.oneFragment, R.id.twoFragment, R.id.threeFragment)
                .build();
        //绑定
        NavigationUI.setupActionBarWithNavController(this,navController,appBarConfiguration);
    }

}

最终运行结果

参考

• Navigation 组件使用入门
• 导航