簡體   English   中英

Jetpack 導航:操作欄中的標題和后退/向上箭頭?

[英]Jetpack navigation: Title and back/up arrow in the action bar?

我已經安裝了最新的金絲雀版本的 Android Studio,並按照這個( https://developer.android.com/topic/libraries/architecture/navigation/navigation-implementing )指令來實現一個簡單的兩頁導航。 基本上 page1 有一個按鈕,當它被點擊時,應用程序顯示 page2。

它有效,但有一個問題......它似乎不會自動對操作欄執行任何操作。 導航庫是否應該自動在操作欄上顯示向上/向后箭頭和“標簽”屬性? 還是我應該像以前一樣手動完成所有工作? 我想在顯示 page2 時在操作(工具)欄上顯示后退箭頭和“詳細信息”。

單擊第 1 頁的按鈕。

override fun onViewCreated(view: View, savedInstanceState: Bundle?)
{
    button1.setOnClickListener {
        val nav = NavHostFragment.findNavController(this);
        nav.navigate(R.id.show_page2)
    }
}

主要活動 XML。 默認情況下,它是默認的操作欄,我已將其替換為工具欄。 沒有區別。

<?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">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_height="?attr/actionBarSize"
        android:elevation="4dp"
        android:background="?attr/colorPrimary"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        android:layout_width="match_parent">
    </androidx.appcompat.widget.Toolbar>

    <fragment
        android:id="@+id/my_nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toolbar"
        app:navGraph="@navigation/nav_graph"/>

</androidx.constraintlayout.widget.ConstraintLayout>

導航圖 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/page1">

    <activity
        android:id="@+id/mainActivity2"
        android:name="com.android.navtest.MainActivity"
        android:label="activity_main"
        tools:layout="@layout/activity_main"/>
    <fragment
        android:id="@+id/page1"
        android:name="com.android.navtest.BlankFragment2"
        android:label="Home page"
        tools:layout="@layout/page1">
        <action
            android:id="@+id/show_page2"
            app:destination="@id/page2"
            app:enterAnim="@anim/anim1"
            app:popExitAnim="@anim/anim2"/>
    </fragment>
    <fragment
        android:id="@+id/page2"
        android:name="com.android.navtest.BlankFragment"
        android:label="Details"
        tools:layout="@layout/page2"/>
</navigation>

您可以使用NavigationUI.setupActionBarWithNavController()將 ActionBar 連接到 NavController。 這通常在您的 Activity 中完成,在您調用setSupportActionBar()

supportActionBar = findViewById<Toolbar>(R.id.toolbar)

// Get the NavController for your NavHostFragment
val navController = findNavController(R.id.nav_host_fragment)

// Set up the ActionBar to stay in sync with the NavController
setupActionBarWithNavController(navController)

這種方法在 Google I/O 2018導航演講中有介紹

如果您希望將導航返回按鈕隱藏在多個位置(默認僅用於主頁片段),您可以將片段的 id 添加到 AppBarConfiguration 並將其作為 setupActionBarWithNavController 的第二個參數傳遞,例如:

val appBarConfiguration = AppBarConfiguration(setOf(R.id.splashFragment, R.id.onboardingFragment, R.id.homeFragment))

setupActionBarWithNavController(findNavController(R.id.nav_host), appBarConfiguration)

這就是我所做的。
當用戶向上導航並再次設置時, onSupportNavigateUp被調用。

通過調用這個setupActionBarWithNavController告訴 android 更新工具欄的標題。

navigateUp通過委派其行為給定NavController手柄向上按鈕。 這通常應該從 AppCompatActivity.onSupportNavigateUp() 調用。

private lateinit var appBarConfiguration: AppBarConfiguration

override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val binding: ActivityGameConfigBinding =
            DataBindingUtil.setContentView(this, R.layout.activity_game_config)
        supportActionBar?.show()

        val navController = Navigation.findNavController(this, R.id.myNavHostFragment)
        NavigationUI.setupActionBarWithNavController(this, navController, null)
        appBarConfiguration = AppBarConfiguration.Builder(navController.graph)
            .build()

        NavigationUI.setupWithNavController(binding.navView, navController)
    }
    override fun onSupportNavigateUp(): Boolean {
        val navController = Navigation.findNavController(this, R.id.myNavHostFragment)
        return NavigationUI.navigateUp(navController, appBarConfiguration)
    }

我的綁定解決方案 - 代碼在 MainActivity 中

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)

    binding = DataBindingUtil.setContentView(this, R.layout.main_activity)
    navHostFragment = supportFragmentManager.findFragmentById(R.id.nav_host_fragment) as NavHostFragment
    navController = navHostFragment.navController

    setSupportActionBar(toolbar)//needs to be after binding
    toolbar.setupWithNavController(navController,AppBarConfiguration(navController.graph))
}

至於標題 - 首先我從導航圖中的片段中刪除了標簽(android:label)(標簽覆蓋了我測試過的標題)

    <fragment
        android:id="@+id/productListFragment"
        android:name="com.example.ProductListFragment"
        android:label="TO_BE_REMOVED"
        tools:layout="@layout/product_list_fragment">
        <action
            android:id="@+id/action_productListFragment_to_mainMenuFragment"
            app:destination="@id/mainMenuFragment" />
    </fragment>

每個片段在onResume設置標題和副標題,這里是 ProductListFragment 的示例

override fun onResume() {
    super.onResume()
    val actionBar = (activity as AppCompatActivity).supportActionBar
    actionBar?.title = getString(R.string.product_list_title)
    actionBar?.subtitle = getString(R.string.product_list_subtitle)
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM