Android Jetpack架構組件之Navigation入門

——沉默不是因爲詞窮，而是因爲心空。現實有多殘酷，你就應該有多堅強。

前言

——這篇主要是梳理一下Jetpack架構組件之一的Navigation，並結合樓主所學做個總結。面向那些還沒接觸Navigation的同學們。看完這篇可以快速瞭解它，並輕鬆使用。也想請教前輩們指點文章中的錯誤或不足的地方。本篇只描述Navigation，不會拓展額外的知識,若想了解更多關於Jetpack組件知識可以看樓主寫的Jetpack專欄。

一、簡介

（1）是什麼

——是Android Jetpack 中的導航組件，支持用戶導航、進入和退出應用中不同內容片段的交互。

這是文檔給的說法，描述簡單。卻不易理解，唯有使用過該組件的方可理解其深刻含義。

這裏就不強行解釋，待瀏覽完該文章再細品。

（2）有什麼用

——Android Jetpack 的導航組件可幫助您實現導航，無論是簡單的按鈕點擊，還是應用欄和抽屜式導航欄等更爲複雜的模式。

（3）有什麼優點

管理 Fragment 更加方便
更好的處理Fragment切換導航問題
該組件還可以支持抽屜式導航欄（DrawerLayout）和底部導航（BottomNavigationView）與頂部應用欄（Toolbar、CollapsingToolbarLayout、ActionBar）

二、基本使用

（1）添加依賴

dependencies {
  def nav_version = "2.1.0"

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

  // Kotlin
  implementation "androidx.navigation:navigation-fragment-ktx:$nav_version"
  implementation "androidx.navigation:navigation-ui-ktx:$nav_version"

}

（2）創建navigation視圖

1.右擊res—New>Android Resource File

2.定義名稱與資源類型 Resource type =Navigation

這邊定義login_navigation.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"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/login_navigation"
    app:startDestination="@id/splashFragment">

    <fragment
        android:id="@+id/splashFragment"
        android:name="com.blcs.xxx.fragment.SplashFragment"
        android:label="splash"
        tools:layout="@layout/fragment_splash" >
        <action
            android:id="@+id/action_splashFragment_to_loginFragment"
            app:destination="@id/loginFragment" />
    </fragment>
    <fragment
        android:id="@+id/loginFragment"
        android:name="com.blcs.xxx.fragment.LoginFragment"
        android:label="login"
        tools:layout="@layout/fragment_login" >
        <action
            android:id="@+id/action_loginFragment_to_registerFragment"
            app:destination="@id/registerFragment" />
    </fragment>
    <fragment
        android:id="@+id/registerFragment"
        android:name="com.blcs.xxx.fragment.RegisterFragment"
        android:label="register"
        tools:layout="@layout/fragment_register" />
</navigation>

可以通過視圖清楚的查看Fragment之間的關係。

（3）Activity中添加NavHost

要使用navigation視圖，需要在Activity佈局中添加NavHost。NavHost也可以稱爲navigation的宿主。

使用如下：activity_splash.xml （app:navGraph="@navigation/login_navigation"）

<?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"
    tools:context=".activity.SplashActivity"
    style="@style/lin_ver">

    <fragment
        android:id="@+id/fragment_login"
        android:name="androidx.navigation.fragment.NavHostFragment"
        style="@style/match_match"
        app:defaultNavHost="true"
        app:navGraph="@navigation/login_navigation"
         />

</LinearLayout>

（4）代碼實現導航功能

下面使用kotlin：

SplashFragment ——> LoginFragment ：

  findNavController().navigate(R.id.action_splashFragment_to_loginFragment)

LoginFragment ——> RegisterFragment：

findNavController().navigate(R.id.action_loginFragment_to_registerFragment)

RegisterFragment ——> LoginFragment ：返回

findNavController().popBackStack()

通過finNavController()可以在Fragment中自由切換。

最後會實現如下效果。

下面具體分析如何使用該導航組件

三、組件分析

該導航組件由以下三個關鍵部分組成：Navigation、NavHost、NavController

（1）Navigation：在一個集中位置包含所有導航相關信息的 XML 資源。這包括應用內所有單個內容區域（稱爲目標）以及用戶可以通過應用獲取的可能路徑

（2）NavHost：顯示導航圖中目標的空白容器。導航組件包含一個默認 NavHost 實現 (NavHostFragment)，可顯示 Fragment 目標

（3）NavController：在 NavHost 中管理應用導航的對象。當用戶在整個應用中移動時，NavController 會安排 NavHost 中目標內容的交換

通過上面的例子：

Navigation實際上就是指navigation文件下的xml文件。

NavHost就是容納navigation的容器。如下面的例子

    <fragment
        android:id="@+id/fragment_login"
        android:name="androidx.navigation.fragment.NavHostFragment"
        style="@style/match_match"
        app:defaultNavHost="true"
        app:navGraph="@navigation/login_navigation"
         />

NavController則是控制Fragment之間的跳轉與切換

四、進階

（1）導航到目的地

Kotlin：

Fragment.findNavController()
View.findNavController()
Activity.findNavController(viewId: Int)
Java：

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

通過上面方法獲取到NavController對象，並調用 navigate() 的某個重載，以在各個目的地之間導航

（2）在Fragment之間傳遞數據

——Navigation 支持您通過定義目的地參數將數據附加到導航操作，可通過以下方式傳遞參數：

1.定義目的地參數

 <fragment android:id="@+id/myFragment" >
         <argument
             android:name="myArg"
             app:argType="integer"
             android:defaultValue="0" />
</fragment>

2.使用 Safe Args 傳遞安全的數據

Navigation 組件具有一個名爲 Safe Args 的 Gradle 插件，該插件可以生成簡單的 object 和 builder 類，以便以類型安全的方式瀏覽和訪問任何關聯的參數。我們強烈建議您將 Safe Args 用於導航和數據傳遞，因爲它可以確保類型安全。

//添加依賴
buildscript {
        repositories {
            google()
        }
        dependencies {
            def nav_version = "2.1.0"
            classpath "androidx.navigation:navigation-safe-args-gradle-plugin:$nav_version"
        }
    }

apply plugin: "androidx.navigation.safeargs"
apply plugin: "androidx.navigation.safeargs.kotlin"

//傳遞參數
    @Override
    public void onClick(View view) {
       EditText amountTv = (EditText) getView().findViewById(R.id.editTextAmount);
       int amount = Integer.parseInt(amountTv.getText().toString());
       ConfirmationAction action =
               SpecifyAmountFragmentDirections.confirmationAction()
       action.setAmount(amount)
       Navigation.findNavController(view).navigate(action);
    }
    
//接收參數方法
   @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        TextView tv = view.findViewById(R.id.textViewAmount);
        int amount = ConfirmationFragmentArgs.fromBundle(getArguments()).getAmount();
        tv.setText(amount + "")
    }

3.使用 Bundle 對象在目的地之間傳遞參數

//傳遞參數
    Bundle bundle = new Bundle();
    bundle.putString("amount", amount);
    Navigation.findNavController(view).navigate(R.id.confirmationAction, bundle);

//接收參數
    TextView tv = view.findViewById(R.id.textViewAmount);
    tv.setText(getArguments().getString("amount"));

4.將數據傳遞給起始目的地

您可以將數據傳遞給應用的起始目的地。首先，您必須顯式構建一個 Bundle 來存儲數據。然後，使用以下方法之一將該 Bundle 傳遞給起始目的地：

如果您要以編程方式創建 NavHost，請調用 NavHostFragment.create(R.navigation.graph, args)，其中 args 是存儲數據的 Bundle。
或者，您也可以通過調用以下 NavController.setGraph() 過載之一來設置起始目的地參數：
使用圖表 ID：navController.setGraph(R.navigation.graph, args)
使用圖表本身：navController.setGraph(navGraph, args)
要檢索起始目的地中的數據，請調用 Fragment.getArguments()。

（3）嵌套導航圖表

——navigation標籤中再嵌入navigation

<?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/mainFragment">
        <fragment
            android:id="@+id/mainFragment"
            android:name="com.example.cashdog.cashdog.MainFragment"
            android:label="fragment_main"
            tools:layout="@layout/fragment_main" >
            <action
                android:id="@+id/action_mainFragment_to_sendMoneyGraph"
                app:destination="@id/sendMoneyGraph" />
            <action
                android:id="@+id/action_mainFragment_to_viewBalanceFragment"
                app:destination="@id/viewBalanceFragment" />
        </fragment>
        <fragment
            android:id="@+id/viewBalanceFragment"
            android:name="com.example.cashdog.cashdog.ViewBalanceFragment"
            android:label="fragment_view_balance"
            tools:layout="@layout/fragment_view_balance" />
        <navigation android:id="@+id/sendMoneyGraph" app:startDestination="@id/chooseRecipient">
            <fragment
                android:id="@+id/chooseRecipient"
                android:name="com.example.cashdog.cashdog.ChooseRecipient"
                android:label="fragment_choose_recipient"
                tools:layout="@layout/fragment_choose_recipient">
                <action
                    android:id="@+id/action_chooseRecipient_to_chooseAmountFragment"
                    app:destination="@id/chooseAmountFragment" />
            </fragment>
            <fragment
                android:id="@+id/chooseAmountFragment"
                android:name="com.example.cashdog.cashdog.ChooseAmountFragment"
                android:label="fragment_choose_amount"
                tools:layout="@layout/fragment_choose_amount" />
        </navigation>
    </navigation>

//跳轉方法
view.findNavController().navigate(R.id.action_mainFragment_to_sendMoneyGraph)

——通過 <include> 引用其他導航圖表、在導航圖表中，您可以使用 include 引用其他圖表

<!-- (root) nav_graph.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"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/nav_graph"
        app:startDestination="@id/fragment">

        <include app:graph="@navigation/included_graph" />

        <fragment
            android:id="@+id/fragment"
            android:name="com.example.myapplication.BlankFragment"
            android:label="Fragment in Root Graph"
            tools:layout="@layout/fragment_blank">
            <action
                android:id="@+id/action_fragment_to_second_graph"
                app:destination="@id/second_graph" />
        </fragment>

        ...
    </navigation>

    <!-- included_graph.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"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/second_graph"
        app:startDestination="@id/includedStart">

        <fragment
            android:id="@+id/includedStart"
            android:name="com.example.myapplication.IncludedStart"
            android:label="fragment_included_start"
            tools:layout="@layout/fragment_included_start" />
    </navigation>

（4）定義全局操作

—— 對於應用中的任何可通過多條路徑到達的目的地，都應定義可轉到它的相應全局操作

創建全局操作

<?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"
                android:id="@+id/main_nav"
                app:startDestination="@id/mainFragment">

      ...

      <action android:id="@+id/action_global_mainFragment"
              app:destination="@id/mainFragment"/>

    </navigation>

使用全局操作

view.findNavController().navigate(R.id.action_global_mainFragment)

（5）在目的地之間添加動畫過渡效果

——藉助 Navigation 組件，可以同時向操作添加屬性動畫和視圖動畫

<fragment
        android:id="@+id/splashFragment"
        android:name="com.blcs.xxx.fragment.SplashFragment"
        android:label="splash"
        tools:layout="@layout/fragment_splash" >
        <action
            android:id="@+id/action_splashFragment_to_loginFragment"
            app:destination="@id/loginFragment"
            app:enterAnim="@anim/nav_default_enter_anim"
            app:exitAnim="@anim/nav_default_exit_anim"
            app:popEnterAnim="@anim/nav_default_pop_enter_anim"
            app:popExitAnim="@anim/nav_default_pop_exit_anim"/>
    </fragment>

——在目的地之間添加共享元素過渡效果

除了過渡動畫之外，Navigation 組件還支持在目的地之間添加共享元素過渡效果。共享元素過渡以編程方式提供，而不是通過您的導航 XML 文件提供，因爲它們需要引用您想要添加到共享元素過渡中的 View 實例

——Fragment 目的地共享元素過渡

藉助 FragmentNavigator.Extras 類，您可以將共享元素附加到對 Fragment 目的地的 navigate() 調用

    FragmentNavigator.Extras extras = new FragmentNavigator.Extras.Builder()
        .addSharedElement(imageView, "header_image")
        .addSharedElement(titleView, "header_title")
        .build();
    Navigation.findNavController(view).navigate(R.id.details,
        null, // Bundle of args
        null, // NavOptions
        extras);

——Activity 目的地共享元素過渡

Activity 依靠 ActivityOptionsCompat 來控制共享元素過渡（啓動具有一個共享元素的 Activity 文檔對此進行了詳細介紹）

    ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this,
            Pair.create(imageView, "header_image"),
            Pair.create(titleView, "header_title"));

    ActivityNavigator.Extras extras = new ActivityNavigator.Extras.Builder()
        .setActivityOptions(options)
        .build();
    Navigation.findNavController(view).navigate(R.id.details,
        null, // Bundle of args
        null, // NavOptions
        extras);

——將彈出動畫應用於 Activity 過渡

   @Override
    public void finish() {
        super.finish();
        ActivityNavigator.applyPopAnimationsToPendingTransition(this);
    }

五、內容推薦

若您發現文章中存在錯誤或不足的地方，希望您能指出！

斌林誠上

發佈了37 篇原創文章 · 獲贊 41 · 訪問量 3萬+

私信關注

Android Jetpack架構組件之Navigation入門

前言

一、簡介

（1）是什麼

（2）有什麼用

（3）有什麼優點

二、基本使用

（1）添加依賴

（2）創建navigation視圖

（3）Activity中添加NavHost

（4）代碼實現導航功能

三、組件分析

四、進階

（1）導航到目的地

（2）在Fragment之間傳遞數據

（3）嵌套導航圖表

（4）定義全局操作

（5）在目的地之間添加動畫過渡效果

五、內容推薦

Android 學習資源收集

Android Jetpack架構組件之Lifecycle入門

Android ButterKnife入門到放棄

Android Espresso入門到自動搞定

Android Rxjava+Retrofit網絡請求框架封裝（一）

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結

Android Jetpack架構組件之Navigation入門

前言

一、簡介

（1）是什麼

（2）有什麼用

（3）有什麼優點

​二、基本使用

（1）添加依賴

（2）創建navigation視圖

（3）Activity中添加NavHost

（4）代碼實現導航功能

三、組件分析

四、進階

（1）導航到目的地

（2）在Fragment之間傳遞數據

（3）嵌套導航圖表

（4）定義全局操作

（5）在目的地之間添加動畫過渡效果

五、內容推薦

二、基本使用