大數據

導航: 嵌套導航圖和 | MAD Skills

嵌套導航圖
我們從導航圖開始。嵌套圖允許您在父導航圖中將一系列目的地頁面分組。

我們看一眼導航圖,coffeeList 和 coffeeEntryDialog 目的地頁面非常適合轉換為嵌套圖。要達成這個目的,我這裡長按 shift 並且同時選擇 "Move to Nested Graph" (移動到嵌套圖):

將 coffeeList 和 coffeeEntryDialogFragment 移動到嵌套圖

現在我們回到代碼界面,您可以看到嵌套圖僅僅是根圖中的新導航圖:

<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"
   app:startDestination="@id/donutList">

   <fragment
       android:id="@+id/donutList"
       android:name="com.android.samples.donuttracker.donut.DonutList"
       android:label="@string/donut_list" >
       <action
           android:id="@+id/action_donutList_to_donutEntryDialogFragment"
           app:destination="@id/donutEntryDialogFragment" />
       <action
           android:id="@+id/action_donutList_to_selectionFragment"
           app:destination="@id/selectionFragment" />
   </fragment>
   <dialog
       android:id="@+id/donutEntryDialogFragment"
       android:name="com.android.samples.donuttracker.donut.DonutEntryDialogFragment"
       android:label="DonutEntryDialogFragment">
       <deepLink app:uri="myapp://navdonutcreator.com/donutcreator" />
       <argument
           android:name="itemId"
           app:argType="long"
           android:defaultValue="-1L" />
   </dialog>
   <fragment
       android:id="@+id/selectionFragment"
       android:name="com.android.samples.donuttracker.setup.SelectionFragment"
       android:label="@string/settings"
       tools:layout="@layout/fragment_selection" >
       <action
           android:id="@+id/action_selectionFragment_to_donutList"
           app:destination="@id/donutList" />
   </fragment>
   <navigation
       android:id="@+id/coffeeGraph"
       app:startDestination="@id/coffeeList">
       <fragment
           android:id="@+id/coffeeList"
           android:name="com.android.samples.donuttracker.coffee.CoffeeList"
           android:label="@string/coffee_list">
           <action
               android:id="@+id/action_coffeeList_to_coffeeEntryDialogFragment"
               app:destination="@id/coffeeEntryDialogFragment" />
       </fragment>
       <dialog
           android:id="@+id/coffeeEntryDialogFragment"
           android:name="com.android.samples.donuttracker.coffee.CoffeeEntryDialogFragment"
           android:label="CoffeeEntryDialogFragment">
           <argument
               android:name="itemId"
               android:defaultValue="-1L"
               app:argType="long" />
       </dialog>
   </navigation>
</navigation>

所選擇的 Fragment 之間的導航被遷移至嵌套圖中。

嵌套圖必須包含 id。您可以使用這個 id 實現導航到嵌套圖的代碼,但並不是直接轉換到其子目的地頁面。嵌套圖包含自己的啟動目的地頁面,並且請不要分開暴露它們的子目的地頁面。

<navigation
   android:id="@+id/coffeeGraph"
   app:startDestination="@id/coffeeList">

如果您雙擊嵌套圖,就可以發現嵌套的目的地頁面和它們之間的操作。

Include 標籤
除了使用嵌套圖之外,我還可以提取圖到新的導航 xml 文件中。我在這裡創建了一個新的 xml 文件,名稱為 coffee_graph,並且將嵌套圖的內容遷移到這個文件中。

<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/coffeeGraph"
   app:startDestination="@id/coffeeList">
   <fragment
       android:id="@+id/coffeeList"
       android:name="com.android.samples.donuttracker.coffee.CoffeeList"
       android:label="@string/coffee_list">
       <action
           android:id="@+id/action_coffeeList_to_coffeeEntryDialogFragment"
           app:destination="@id/coffeeEntryDialogFragment" />
   </fragment>
   <dialog
       android:id="@+id/coffeeEntryDialogFragment"
       android:name="com.android.samples.donuttracker.coffee.CoffeeEntryDialogFragment"
       android:label="CoffeeEntryDialogFragment">
       <argument
           android:name="itemId"
           android:defaultValue="-1L"
           app:argType="long" />
   </dialog>
</navigation>

我可以通過 include 標籤將新的圖嵌套到其他文件中。雖然使用 include 標籤在功能上與使用嵌套圖相同,但您還可以使用其他項目模塊或者庫項目的圖。

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

和嵌套圖相類似,引用的圖不會暴露目的地頁面的列表,也就是說我需要更新菜單 id 來指向 coffeeList。

<item
   android:id="@id/coffeeGraph"
   android:icon="@drawable/coffee_cup"
   android:title="@string/coffee_name" />

這裡我更新了菜單以使用引用圖的 id。由於 CoffeeList 是所引用圖的起始頁面,所以我可以使用圖 id 來導航到這個圖。如果您現在試著運行應用,所有的功能會和之前一樣。

現在咖啡記錄的導航圖已經實現分離,我們可以對應用進行模塊化處理,順便可以看一下在模塊之間導航的效果如何。

如果您希望同步操作,可以檢查 代碼,裡面包含了到目前為止我所做的全部修改。我創建了兩個新的模塊: core 和 coffee。我將所有常用的類遷移到 core 模塊中,比如 Donut、Coffee、DAO、Database 以及其他常見資源。

接下來,我將所有在咖啡記錄中用到的 fragment、viewModel 和 adapter 類遷移到 coffee 模塊中。在咖啡記錄中用到的佈局和其他資源也遷移到這裡,包括 coffee_graph。

如果你想了解更多關於前後端的技術內容,可以通過技術開發平臺:廈門在乎科技-專注小程序開發、廈門app開發公司、網站開發

Leave a Reply

Your email address will not be published. Required fields are marked *