底部导航视图答案

【问题标题】：bottom navigation view底部导航视图
【发布时间】：2019-01-12 11:29:44
【问题描述】：

我正在尝试在我的应用程序中使用底部导航视图，但我无法让它工作，因为根据我在底部导航视图中显示的项目数量，它的行为似乎有所不同

这是我只有三个项目时的视图。

它显示为我想要的

但是当我把它变成四个时，视图变得很糟糕

它不会扩展到适合我的屏幕边缘，它只是位于我的屏幕中心。

下面是我的活动主布局

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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">


<android.support.design.widget.AppBarLayout
    android:id="@+id/appBarLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">


    <include
        android:id="@+id/main_app_bar"
        layout="@layout/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</android.support.design.widget.AppBarLayout>

<FrameLayout
    android:id="@+id/frame_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />


<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:layout_alignParentBottom="true"
    app:itemBackground="@color/colorPrimary"
    app:itemIconTint="@color/white"
    app:itemTextColor="@color/white"
    app:menu="@menu/navigation" />

</android.support.design.widget.CoordinatorLayout>

【问题讨论】：

标签： java android design-patterns bottomnavigationview

【解决方案1】：

为底部导航视图添加标签可见性模式

<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    app:labelVisibilityMode="labeled" // this line
    android:background="@color/colorPrimary"
    app:itemBackground="@color/colorPrimary"
    app:itemIconTint="@color/white"
    app:itemTextColor="@color/white"
    app:menu="@menu/navigation" />

【讨论】：

【解决方案2】：

BottomNavigationView 有条件：当超过 3 个项目时使用移位模式。查看此答案。 Visit

【讨论】：

【解决方案3】：

由于您拥有三个以上的项目，您可能必须禁用班次模式。请看这个问题的答案How to disable BottomNavigationView shift mode?

【讨论】：