JetPack-Navigation(一)

一、Navigation介绍

  项目中多使用单个Activity嵌套多个Fragment的UI架构模式，但是对Fragment的管理一直比较麻烦，通常使用FragmentManager和FragmentTransaction来管理Fragment之间的切换，页面的切换通常还包括对应用程序APPBar的管理，Fragment之间的切换动画，以及Fragment间的参数传递，纯代码方式使用不是很友好，并且Fragment和APPBar在管理和使用中比较混乱，为此JetPack提供了Navigation组件，旨在方便管理页面和APPBar。

使用Navigation的优势

• 可视化的页面导航图，便于我们理清页面之间的关系（XML显示）
• 通过destination和action完成页面间的导航
• 方便添加页面切换动画
• 页面间类型安全的参数传递
• 通过NavigationUI类，对菜单，底部导航，抽屉菜单导航进行统一的管理
• 支持深层连接DeepLink

二、Navigation主要元素

• Navigation Graph，一种XML文件，包含应用程序所有的页面，以及页面之间的关系
• NavHostFragment，一种特殊的Fragment，是其他Fragment的容器，Navigation Graph中的Fragment是通过NavHostFragment进行展示的
• NavController，这是一个kt 或者Java对象，用于在代码中完成Navigation Graph中具体页面切换工作。

工作方式：

  当你想切换Fragment时，使用NavController对象，告诉你想要去Navigation Graph中的哪个Fragment，NavController会将你想要去的Fragment展示在NavHostFragment中

三、使用Navigation

3.1、 创建Navigation Graph

添加依赖

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

在res下新建选择Android resourceFile新建一个Navigation Graph文件。设置名称为"nav_graph"，选择种类为"Navigation"。

所生成的xml文件和布局文件相似，有design和text两个面板。

3.2、添加NavHostFragment

我们在MainActivity的布局文件中添加一个NavHostFragment作为所有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/nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/nav_graph" />
</androidx.constraintlayout.widget.ConstraintLayout>

ATTENTION

 android:name="androidx.navigation.fragment.NavHostFragment"

这一样代码告诉系统，这是一个特殊的Fragment。

app:defaultNavHost="true"

将app:defaultNavHost="true"设置为true，则该Fragment会自动处理系统返回键，即当用户按下手机的返回按键时，系统能自动将当前展示的Fragment退出。

app:navGraph="@navigation/nav_graph"

app:navGraph属性用于设置Fragment对应的导航图。设置这个属性后，我们在nav_graph导航图上，就可以看见我们设置的NavHostFragment

3.3、创建destination

单击Create new destination，创建一个destination

一个destination代表一个路由页面。我们创建一个MainFragment。这时我们的na v_graph的界面出现一个main_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/mainFragment">

    <fragment
        android:id="@+id/mainFragment"
        android:name="com.example.navigationdemo.MainFragment"
        android:label="fragment_main"
        tools:layout="@layout/fragment_main" >
      
    </fragment>
  
</navigation>

navigation标签下会出现一个app:startDestination属性，该属性指定起始destination为mainFragment。

3.4、Fragment页面切换

单击Create new destination，创建一个SecondFragment。单击mainFragment，用鼠标选中右侧的圆圈，并拖拽到右边的SecondFragment。

拖拽后，在看XML代码，会出现一个action标签，并自动给出id。

3.5、使用NavController完成导航

我们在MainFragment中添加一个Button跳转到SecondFragmen。

   //跳转到第二个Fragment
        mBtnToSecondFragment.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Navigation.findNavController(v).navigate(R.id.action_mainFragment_to_secondFragment);
            }
        });

//第二种方法
        mBtnToSecondFragment.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Navigation.createNavigateOnClickListener(R.id.action_mainFragment_to_secondFragment);
            }
        });

3.6、添加页面切换效果

3.6.1、使用XML添加切换效果

在res新建anim，打开导航文件的Design面板。选择Attribute，选择Animation。

选择对应的动画效果

设置完动画，我们可以看见action标签里就加上了动画属性，运行可以看见效果

3.6.2、使用NavOptions对象添加切换效果

 //跳转到第二个Fragment
        mBtnToSecondFragment.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                NavOptions options = new NavOptions.Builder()
                        .setEnterAnim(android.R.anim.fade_in)
                        .setExitAnim(android.R.anim.fade_out)
                        .setPopEnterAnim(android.R.anim.fade_in)
                        .setPopExitAnim(android.R.anim.fade_out)
                        .build();
                Navigation.findNavController(v).navigate(R.id.action_mainFragment_to_secondFragment,null,options);
            }
        });