使用Android Jetpack导航组件和Android BottomAppBar

使用Android Jetpack导航组件和Android BottomAppBar,android,kotlin,android-jetpack,android-architecture-navigation,android-bottomappbar,Android,Kotlin,Android Jetpack,Android Architecture Navigation,Android Bottomappbar,我正在尝试在我的主要活动中使用新的Android底部应用程序栏来实现Jetpack导航,但它没有正常工作 我已经阅读了有关导航的说明,似乎没有找到任何方法将导航jetpack集成到新的底部应用程序栏中。我试着按照我的方式做,如下所示: 我正在使用一个包含4个片段的活动在底部应用程序栏的导航抽屉中导航 当我单击此按钮时,预期输出应为: 它应该像这样打开一个抽屉: 我应该能够在片段之间导航 但是,当我使用以下代码时 activity_home.xml <layout xml

我正在尝试在我的主要活动中使用新的Android底部应用程序栏来实现Jetpack导航,但它没有正常工作

我已经阅读了有关导航的说明,似乎没有找到任何方法将导航jetpack集成到新的底部应用程序栏中。我试着按照我的方式做,如下所示:

我正在使用一个包含4个片段的活动在底部应用程序栏的导航抽屉中导航

当我单击此按钮时,预期输出应为:

它应该像这样打开一个抽屉:

我应该能够在片段之间导航

但是,当我使用以下代码时

activity_home.xml

<layout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">

    <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

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

        <androidx.coordinatorlayout.widget.CoordinatorLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

            <com.google.android.material.bottomappbar.BottomAppBar
                    android:id="@+id/bottom_app_bar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom"
                    app:fabAlignmentMode="center"
                    app:navigationIcon="@drawable/ic_menu_dark"
                    app:menu="@menu/bottomappbar_main_menu"/>


            <com.google.android.material.floatingactionbutton.FloatingActionButton
                    android:id="@+id/fab"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_add_black"
                    android:backgroundTint="@color/colorAccent"
                    app:layout_anchor="@id/bottom_app_bar"/>

        </androidx.coordinatorlayout.widget.CoordinatorLayout>

    </androidx.constraintlayout.widget.ConstraintLayout>

</layout>
<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <fragment
                    android:id="@+id/navFragment"
                    android:name="androidx.navigation.fragment.NavHostFragment"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    app:defaultNavHost="true"
                    app:navGraph="@navigation/nav_graph"
                    android:layout_marginBottom="60dp"
                    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>


        <com.google.android.material.bottomappbar.BottomAppBar
                android:id="@+id/bottom_app_bar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                app:fabAlignmentMode="center"
                style="@style/Widget.MaterialComponents.BottomAppBar"
                app:menu="@menu/bottomappbar_main_menu"
                android:backgroundTint="@color/colorPrimaryDark"
                app:navigationIcon="@drawable/ic_menu_dark"/>


        <com.google.android.material.floatingactionbutton.FloatingActionButton
                android:id="@+id/fab"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_add_black"
                android:backgroundTint="@color/colorAccent"
                app:layout_anchor="@id/bottom_app_bar"/>

        <com.google.android.material.navigation.NavigationView
                android:id="@+id/navigation_view"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_anchor="@id/bottom_app_bar"
                android:background="@android:color/white"
                android:layout_gravity="start"
                app:menu="@menu/bottomappbar_drawer_menu"/>

    </androidx.coordinatorlayout.widget.CoordinatorLayout>


</RelativeLayout>
发生的情况是,底部应用程序栏上的菜单图标消失,如下所示:

我想我没有正确使用Jetpack导航


您能提供一个链接或一些代码来帮助我们如何使这项工作正常进行吗?

如下更改您的活动和布局

主要活动

class MainActivity : AppCompatActivity() {
   private lateinit var mBinding: ActivityHomeBinding

   override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      mBinding = DataBindingUtil.setContentView(this, R.layout.activity_home)

      val navController = Navigation.findNavController(this, R.id.navFragment)
      mBinding.navigationView.setupWithNavController(navController)

      setSupportActionBar(mBinding.bottomAppBar)

      if (mBinding.navigationView.isShown) {
          mBinding.navigationView.visibility = View.VISIBLE
      } else {
          mBinding.navigationView.visibility = View.GONE
      }

  }

  override fun onCreateOptionsMenu(menu: Menu?): Boolean {
      val inflater = menuInflater
      inflater.inflate(R.menu.bottomappbar_main_menu, menu)
      return true
  }

  override fun onOptionsItemSelected(item: MenuItem?): Boolean {
      when(item?.itemId){
          android.R.id.home -> {
              Log.e("TAG", "Visbility>>>> ${mBinding.navigationView.isShown}")
              if (!mBinding.navigationView.isShown) {
                  mBinding.navigationView.visibility = View.VISIBLE
              } else {
                  mBinding.navigationView.visibility = View.GONE
              }
          }
          R.id.search -> {
              Toast.makeText(this, "Search clicked!", Toast.LENGTH_SHORT).show()
          }
      }

      return true
  }

}
activity_home.xml

<layout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">

    <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

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

        <androidx.coordinatorlayout.widget.CoordinatorLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

            <com.google.android.material.bottomappbar.BottomAppBar
                    android:id="@+id/bottom_app_bar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom"
                    app:fabAlignmentMode="center"
                    app:navigationIcon="@drawable/ic_menu_dark"
                    app:menu="@menu/bottomappbar_main_menu"/>


            <com.google.android.material.floatingactionbutton.FloatingActionButton
                    android:id="@+id/fab"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_add_black"
                    android:backgroundTint="@color/colorAccent"
                    app:layout_anchor="@id/bottom_app_bar"/>

        </androidx.coordinatorlayout.widget.CoordinatorLayout>

    </androidx.constraintlayout.widget.ConstraintLayout>

</layout>
<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <fragment
                    android:id="@+id/navFragment"
                    android:name="androidx.navigation.fragment.NavHostFragment"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    app:defaultNavHost="true"
                    app:navGraph="@navigation/nav_graph"
                    android:layout_marginBottom="60dp"
                    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>


        <com.google.android.material.bottomappbar.BottomAppBar
                android:id="@+id/bottom_app_bar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                app:fabAlignmentMode="center"
                style="@style/Widget.MaterialComponents.BottomAppBar"
                app:menu="@menu/bottomappbar_main_menu"
                android:backgroundTint="@color/colorPrimaryDark"
                app:navigationIcon="@drawable/ic_menu_dark"/>


        <com.google.android.material.floatingactionbutton.FloatingActionButton
                android:id="@+id/fab"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_add_black"
                android:backgroundTint="@color/colorAccent"
                app:layout_anchor="@id/bottom_app_bar"/>

        <com.google.android.material.navigation.NavigationView
                android:id="@+id/navigation_view"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_anchor="@id/bottom_app_bar"
                android:background="@android:color/white"
                android:layout_gravity="start"
                app:menu="@menu/bottomappbar_drawer_menu"/>

    </androidx.coordinatorlayout.widget.CoordinatorLayout>


</RelativeLayout>


如下更改您的活动和布局

主要活动

class MainActivity : AppCompatActivity() {
   private lateinit var mBinding: ActivityHomeBinding

   override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      mBinding = DataBindingUtil.setContentView(this, R.layout.activity_home)

      val navController = Navigation.findNavController(this, R.id.navFragment)
      mBinding.navigationView.setupWithNavController(navController)

      setSupportActionBar(mBinding.bottomAppBar)

      if (mBinding.navigationView.isShown) {
          mBinding.navigationView.visibility = View.VISIBLE
      } else {
          mBinding.navigationView.visibility = View.GONE
      }

  }

  override fun onCreateOptionsMenu(menu: Menu?): Boolean {
      val inflater = menuInflater
      inflater.inflate(R.menu.bottomappbar_main_menu, menu)
      return true
  }

  override fun onOptionsItemSelected(item: MenuItem?): Boolean {
      when(item?.itemId){
          android.R.id.home -> {
              Log.e("TAG", "Visbility>>>> ${mBinding.navigationView.isShown}")
              if (!mBinding.navigationView.isShown) {
                  mBinding.navigationView.visibility = View.VISIBLE
              } else {
                  mBinding.navigationView.visibility = View.GONE
              }
          }
          R.id.search -> {
              Toast.makeText(this, "Search clicked!", Toast.LENGTH_SHORT).show()
          }
      }

      return true
  }

}
activity_home.xml

<layout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">

    <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

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

        <androidx.coordinatorlayout.widget.CoordinatorLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

            <com.google.android.material.bottomappbar.BottomAppBar
                    android:id="@+id/bottom_app_bar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom"
                    app:fabAlignmentMode="center"
                    app:navigationIcon="@drawable/ic_menu_dark"
                    app:menu="@menu/bottomappbar_main_menu"/>


            <com.google.android.material.floatingactionbutton.FloatingActionButton
                    android:id="@+id/fab"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_add_black"
                    android:backgroundTint="@color/colorAccent"
                    app:layout_anchor="@id/bottom_app_bar"/>

        </androidx.coordinatorlayout.widget.CoordinatorLayout>

    </androidx.constraintlayout.widget.ConstraintLayout>

</layout>
<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <fragment
                    android:id="@+id/navFragment"
                    android:name="androidx.navigation.fragment.NavHostFragment"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    app:defaultNavHost="true"
                    app:navGraph="@navigation/nav_graph"
                    android:layout_marginBottom="60dp"
                    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>


        <com.google.android.material.bottomappbar.BottomAppBar
                android:id="@+id/bottom_app_bar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                app:fabAlignmentMode="center"
                style="@style/Widget.MaterialComponents.BottomAppBar"
                app:menu="@menu/bottomappbar_main_menu"
                android:backgroundTint="@color/colorPrimaryDark"
                app:navigationIcon="@drawable/ic_menu_dark"/>


        <com.google.android.material.floatingactionbutton.FloatingActionButton
                android:id="@+id/fab"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_add_black"
                android:backgroundTint="@color/colorAccent"
                app:layout_anchor="@id/bottom_app_bar"/>

        <com.google.android.material.navigation.NavigationView
                android:id="@+id/navigation_view"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_anchor="@id/bottom_app_bar"
                android:background="@android:color/white"
                android:layout_gravity="start"
                app:menu="@menu/bottomappbar_drawer_menu"/>

    </androidx.coordinatorlayout.widget.CoordinatorLayout>


</RelativeLayout>


我一直在尝试将导航与底部应用程序栏连接起来,但无法正常工作。下面的答案对你有用吗?如果是,你能分享代码吗?我一直在尝试将导航与底部的应用程序栏连接起来,但无法让它工作。下面的答案对你有用吗?如果是,您可以共享代码吗?