如何同时使用导航抽屉和底部导航 - 导航架构组件
Posted
技术标签:
【中文标题】如何同时使用导航抽屉和底部导航 - 导航架构组件【英文标题】：How to use Navigation Drawer and Bottom Navigation simultaneously - Navigation Architecture Component 【发布时间】：2019-09-23 05:46:30 【问题描述】：我的屏幕如下所示，在同一屏幕上包含导航抽屉和底部导航：
我正在使用 Jetpack 导航架构组件。
当前问题和我尝试过的问题？
单击底部第二和第三个导航项会在工具栏上显示返回箭头？
已尝试：将与第二和第三底部导航关联的片段设置为***目的地
appBarConfig = AppBarConfiguration(setOf(R.layout.fragment_star, R.layout.fragment_stats, R.layout.fragment_user))
而不是
appBarConfig = AppBarConfiguration(navController.graph, drawerLayout)
没用。
非常感谢任何帮助！
我的代码如下所示。
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<layout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.drawerlayout.widget.DrawerLayout
android:id="@+id/drawerLayout"
android:layout_
android:layout_
android:fitsSystemWindows="true">
<LinearLayout
android:layout_
android:layout_
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_
android:layout_
android:background="?attr/colorPrimary"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<fragment
android:id="@+id/navHostFragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_
android:layout_
android:layout_weight="1"
app:defaultNavHost="true"
app:navGraph="@navigation/nav_graph" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bottomNav"
android:layout_
android:layout_
android:layout_gravity="bottom"
android:background="?android:attr/windowBackground"
app:menu="@menu/menu_bottom" />
</LinearLayout>
<!-- gives navDrawer material look-->
<com.google.android.material.navigation.NavigationView
android:id="@+id/navView"
android:layout_
android:layout_
android:layout_gravity="start"
app:menu="@menu/nav_drawer_menu"
app:headerLayout="@layout/nav_header"
android:fitsSystemWindows="true"
/>
</androidx.drawerlayout.widget.DrawerLayout>
</layout>
menu_bottom.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/starFragment"
android:icon="@drawable/ic_star_green_48dp"
android:title="@string/bottom_nav_title_star"/>
<item
android:id="@+id/statsFragment"
android:icon="@drawable/ic_stats_green_48dp"
android:title="@string/bottom_nav_title_stats"/>
<item
android:id="@+id/userFragment"
android:icon="@drawable/ic_user_green_48dp"
android:title="@string/bottom_nav_title_user"/>
</menu>
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_main"
app:startDestination="@id/starFragment">
<fragment
android:id="@+id/starFragment"
android:name="com.example.app.ui.StarrFragment"
android:label="Star"
tools:layout="@layout/fragment_star">
</fragment>
<fragment
android:id="@+id/statsFragment"
android:name="com.example.app.StatsFragment"
android:label="fragment_stats"
tools:layout="@layout/fragment_stats" />
<fragment
android:id="@+id/userFragment"
android:name="com.example.app.UserFragment"
android:label="fragment_user"
tools:layout="@layout/fragment_user" />
</navigation>
ActivityMain.kt
class MainActivity : AppCompatActivity()
private lateinit var drawerLayout: DrawerLayout
private lateinit var appBarConfig: AppBarConfiguration
private lateinit var navController: NavController
override fun onCreate(savedInstanceState: Bundle?)
super.onCreate(savedInstanceState)
val binding = DataBindingUtil.setContentView<ActivityMainBinding>(this, R.layout.activity_main)
setSupportActionBar(toolbar)
drawerLayout = binding.drawerLayout
navController = this.findNavController(R.id.navHostFragment)
binding.bottomNav.setupWithNavController(navController)
NavigationUI.setupActionBarWithNavController(this, navController, drawerLayout)
appBarConfig = AppBarConfiguration(navController.graph, drawerLayout)
// lock drawer when not in start destination
navController.addOnDestinationChangedListener nc, nd, _ ->
if(nd.id == nc.graph.startDestination)
drawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED)
else
drawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED)
NavigationUI.setupWithNavController(binding.navView, navController)
override fun onSupportNavigateUp(): Boolean
// replace navigation up button with nav drawer button when on start destination
return NavigationUI.navigateUp(navController, appBarConfig)
【问题讨论】：
答案取决于底部导航标签是否需要保留自己的堆栈。 由于底部导航显示更高级别的目的地，最好维护多个后台 好吧，如果设计师没有要求，我完全不会这样做：D @EpicPandaForce 我实际上需要多个堆栈。 啊，那时我倾向于说“你需要使用这个 hack：github.com/googlesamples/android-architecture-components/blob/…，祝你好运” 【参考方案1】：无需编写单独的代码即可将后退按钮替换为抽屉图标。
在 AppBarConfiguration 中传递您用于从底部导航和导航抽屉导航的片段 ID（来自 nav_graph）。 （P.S 片段及其关联的图标应该具有相同的 id）
对于您的情况，AppBarConfiguration 应如下所示：
appBarConfig = AppBarConfiguration.Builder(R.id.starFragment, R.id.statsFragment, R.id.userFragment)
.setDrawerLayout(drawerLayout)
.build()
设置操作栏：
setSupportActionBar(toolbar)
setupActionBarWithNavController(navController, appBarConfig)
现在为底部导航和导航视图设置导航控制器：
navView.setupWithNavController(navController)
bottomNav.setupWithNavController(navController)
onSupportNavigateUp 函数应该是：
override fun onSupportNavigateUp(): Boolean
return navController.navigateUp(appBarConfig)
如果抽屉打开，应处理后退按钮：
override fun onBackPressed()
if (drawerLayout.isDrawerOpen(GravityCompat.START))
drawerLayout.closeDrawer(GravityCompat.START)
else
super.onBackPressed()
奖金
默认情况下，当您按 icon_1 然后 icon_2 然后 icon_3 的顺序单击底部导航图标并从那里按返回按钮时，它将导航回主页图标，即 icon_1
如果您想以单击图标的相反顺序（返回堆栈方式）返回导航，则将 android:menuCategory="secondary" 添加到菜单中的项目。所以你的菜单会是这样的：
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/starFragment"
android:icon="@drawable/ic_star_green_48dp"
android:title="@string/bottom_nav_title_star"
android:menuCategory="secondary"/>
<item
android:id="@+id/statsFragment"
android:icon="@drawable/ic_stats_green_48dp"
android:title="@string/bottom_nav_title_stats"
android:menuCategory="secondary"/>
<item
android:id="@+id/userFragment"
android:icon="@drawable/ic_user_green_48dp"
android:title="@string/bottom_nav_title_user"
android:menuCategory="secondary"/>
</menu>
希望后退按钮图标现在可以解决:)
【讨论】：
如果你有时间请准备repo，我可以检查并接受答案 @user158 你可以查看我的仓库here：github.com/Atr07/drawer-with-bottom-navigation-architecture 完美解决方案【参考方案2】：This project使用DrawerLayout并使用RadioButtons模拟BottomNavigationView，这是我找到的解决问题的方法
在 Google Codelab 导航项目中，他们执行 Adithya T Raj 提到的操作，但它仅用于在横向上显示 DrawerLayout，在纵向上显示 BottomNavigationView。 The project link：
我试图强迫他们同时显示on this branch，但只显示 DrawerLayout
【讨论】：
如果你要删除这个答案，我请版主解释原因，对我来说这个答案是对所提出的问题的回应。【参考方案3】：首先，这不是一个好的设计方法。如果你想要类似的东西，你应该使用底部应用栏（不是带有导航抽屉的底部导航视图）
这是给你的指南：Article Link
您可以轻松地调整您的应用程序。
【讨论】：
感谢您的回复，由于可及性，我决定使用底部导航。（使事情易于访问（即：从主屏幕单击）以上是关于如何同时使用导航抽屉和底部导航 - 导航架构组件的主要内容，如果未能解决你的问题，请参考以下文章
如何在新的导航抽屉架构组件中实现共享应用或评分应用或注销功能