Jetpack_Architecture之Navigation内部导航

一、前言

Navigation是属于Jetpack库中关于架构模块的内容之一，用于内部导航，

二、注意

1. 需要AndroidStudio的版本3.2以上
2. Navigation，最好是只用于fragment之间的页面跳转，可以尝试用于写单activity应用。
3. 文档：https://developer.android.google.cn/topic/libraries/architecture/navigation/

三、具体使用

3.1、创建两个fragment

//fragment1

<?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"
    android:background="@color/colorAccent"
    tools:context=".Fragment1">
    <Button
        android:id="@+id/f1_go"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="fragment1" />
</FrameLayout>


//fragment2

<?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"
    android:background="@color/colorPrimary"
    tools:context=".Fragment2">

    <Button
        android:id="@+id/f2_go"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="fragment2" />

</FrameLayout>

3.2、编写navigation

3.2.1、创建navigation文件

右键app -----》new------》Android Resource File ----》在弹出窗体输入文件名，Resource type选择为Navigation 。

3.2.2、添加fragment

在res/navigation文件目录，选择刚才创建的文件，选择Design模式。点击右上角的按钮，选择添加fragment1，、fragment2。

3.2.3、建立跳转关联

点击fragment1视图的右侧边缘中部，重出现的圆点出拉出线条到framgent2建立关联。

3.2.4、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/mobile_navigation"
    app:startDestination="@id/fragment1">

    <fragment
        android:id="@+id/fragment1"
        android:name="com.qdtgkj.navigationdemo.Fragment1"
        android:label="fragment1"
        tools:layout="@layout/fragment1">
        <action
            android:id="@+id/action_fragment1_to_fragment2"
            app:destination="@id/fragment2"/>
    </fragment>
    <fragment
        android:id="@+id/fragment2"
        android:name="com.qdtgkj.navigationdemo.Fragment2"
        android:label="fragment2"
        tools:layout="@layout/fragment2" />
</navigation>

3.3、具体代码实现

3.3.1、在activity_main中添加Navigation的fragment容器

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

a、android:name="androidx.navigation.fragment.NavHostFragment"
将传统的fragment指定为，属性为Navigation的容器
b、app:navGraph="@navigation/mobile_navigation" 
关联Navigation文件。  即 app:defaultNavHost="true"
c、app:defaultNavHost="true"
让Navigation处理返回事件。点返回按钮时并不是返回上一个 Activity，而是返回上一个「页面」，上一个「页面」有可能是 Activity，也可能是 Fragment

 

3.3.2、在MainActivity中重写onSupportNavigateUp方法，该方法主要是为了指定容器。

override fun onSupportNavigateUp(): Boolean = 
Navigation.findNavController(this, R.id.fragmentNavigation).navigateUp()

3.3.3、在fragment1中编写跳转事件

 f1_go.setOnClickListener {
            val mBundle = Bundle()
            mBundle.putString("pwd", "123456")
            Navigation.findNavController(it).navigate(R.id.action_fragment1_to_fragment2, mBundle)
        }

注：1、action_fragment1_to_fragment2在Navigation文件中action的id。

      2、通过bundle传递参数。

3.3.4、在fragment2中编写返回事件，改事件代表返回

        f2_go.setOnClickListener {
            Navigation.findNavController(it).navigateUp()
        }

3.3.5、在fragment2中获取fragment1传递的参数。通过arguments获取到传递的bundle，然后获取传递的参数。

        arguments?.let {
            pwd = it["参数名"] as String
        }

 

3.4 添加过度动画

在navigation文件，的action节点中，添加界面的退出和录入动画。

        <action
            android:id="@+id/action_fragment1_to_fragment2"
            app:destination="@id/fragment2"
            app:enterAnim="@anim/slide_in_right"
            app:exitAnim="@anim/slide_out_left"
            app:popEnterAnim="@anim/slide_in_left"
            app:popExitAnim="@anim/slide_out_right"/>