导航后不显示底部导航视图

Question

在我的项目中，我将 navhost 片段和 BottomNavigationView 添加到我的 activity_main 中，导航时一切正常，但是当我单击工具栏选项时，我导航到另一个页面但我仍然看到底部导航视图，我怎么看不到底部导航视图？我添加了导航 xml 来导航所有页面，并在我的资源文件上创建了底部导航菜单。唯一的问题是当我导航到底部导航页面内的另一个页面时，我仍然看到底部导航视图。

<androidx.appcompat.widget.Toolbar
    android:id="@+id/app_toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">


    <TextView
        android:id="@+id/app_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:contentDescription="@string/text_some"
        android:fontFamily="@font/lobster_two"
        android:text="@string/text_some"
        android:textColor="@color/colorSecondary"
        android:textSize="24sp" />
</androidx.appcompat.widget.Toolbar>


<fragment
    android:id="@+id/nav_host_fragment"
    android:name="androidx.navigation.fragment.NavHostFragment"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    app:defaultNavHost="true"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/app_toolbar"
    app:layout_constraintVertical_bias="0.0"
    app:navGraph="@navigation/bottom_navigation_graph" />

<androidx.constraintlayout.widget.ConstraintLayout
    android:id="@+id/bottom_navigation_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent">

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_nav"
        android:layout_width="0dp"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary"
        android:showAsAction="always|withText"
        app:itemIconSize="22dp"
        app:itemIconTint="@drawable/bottom_nav_color"
        app:itemTextColor="@drawable/bottom_nav_color"
        app:labelVisibilityMode="labeled"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_nav_menu" />

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/circle_view_image"
        android:layout_width="66dp"
        android:layout_height="66dp"
        android:layout_marginBottom="25dp"
        android:elevation="99dp"
        android:src="@drawable/image"
        app:layout_constraintBottom_toBottomOf="@+id/bottom_nav"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Answer 1

when i click the toolbar options i navigated to the another page

我不确定这是什么意思，但我假设单击此工具栏图标会启动一个全局操作，该操作会导航到您要隐藏底部导航的另一个片段。

为了隐藏某些片段中的底部导航，请在您的 MainActivity:

中执行此操作

  navController.addOnDestinationChangedListener { _, nd: NavDestination, _->
    if (nd.id == R.id.fragmentWithNoBottomNav){
        bottom_nav.visibility = View.GONE
    } else {
        bottom_nav.visibility = View.VISIBLE
    }

Answer 2

我已经为这个问题苦苦挣扎了一段时间，最后我采用了这种方法：在您的 MainActivity

companion object {
    private val BOTTOM_NAV_VISIBLE_FRAGMENTS =
        listOf(
            R.id.Fragment1,
            R.id.Fragment2,
            R.id.Fragment3,
            R.id.Fragment4,
        )
    private const val EXIT_DURATION = 250L
    private const val ENTER_DURATION = 250L
}

为 BottomNavigationView 可见性定义一个 getter 函数

    private val isBottomNavigationViewVisible: Boolean
    get() = bottom_nav.visibility == View.VISIBLE

然后在你的 onCreate 函数中：

navController.addOnDestinationChangedListener { _, destination, b ->
        invalidateOptionsMenu()
        when (destination.id) {
            in BOTTOM_NAV_VISIBLE_FRAGMENTS -> {
                if (!isBottomNavigationViewVisible) showBottomNavigation()
            }
         
            else -> {
                if (isBottomNavigationViewVisible) hideBottomNavigation()
            }
        }
    }

考虑你从 fragment1 切换到 fragment2，两者都将 bottom_nav.visibility 设置为 true，那些 if 语句如果前一个片段和当前片段都具有相同的 bottom_nav 可见性（View.Gone 或 View.Visible）

，则防止动画成为运行

然后你可以定义两个函数：showBottomNavigationView 和 hideBottomNavigationView 这样你就可以设置动画和...如果你喜欢

例如：

    private fun hideBottomNavigation() {
    with(bottom_nav) {
        if (visibility == View.VISIBLE && alpha == 1f) {
            animate()
                .alpha(0f)
                .withEndAction { visibility = View.GONE }
                .duration = EXIT_DURATION
        }
    }
}

private fun showBottomNavigation() {
    with(bottom_nav) {
        visibility = View.VISIBLE
        animate()
            .alpha(1f)
            .duration = ENTER_DURATION
    }
}

使用这种方法，如果你想在另一个片段中显示 bottomNavigationView，你只需要将该片段 ID 添加到 BOTTOM_NAV_VISIBLE_FRAGMENTS 列表中，如果您想更改 hide/show 动画，只需将其添加到 show/hideBottomNavigationView 函数即可。

希望对您有所帮助:)

导航后不显示底部导航视图

After the navigation do not show Bottom navigation view

navigation

android

kotlin

android-jetpack-navigation