等于 space 个 BottomNavigationView 的菜单项

Question

我正在使用 BottomNavigationView（从现在开始使用 BNV）在片段之间切换，但我找不到 XML 属性或无法找到所有项目（图像）等间距，以便它们填满所有设备的整个宽度。

我的 XML 为 activity 包含 BNV（请原谅颜色不好，只是为了更清楚）：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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=".Navigation">

    <!--Toolbar-->
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:background="@color/main_light_blue"
        app:titleTextColor="@color/white"
        android:elevation="4dp" />

    <FrameLayout 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/main_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="0dp"
        android:layout_marginTop="50dp"
        android:layout_marginBottom="57dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:context="MainActivity">
    </FrameLayout>

    <!--BNV-->
    <android.support.design.widget.BottomNavigationView
        android:id="@+id/footer"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="0dp"
        app:elevation="0dp"
        app:itemBackground="@android:color/holo_orange_dark"
        android:background="@android:color/holo_orange_dark"
        app:itemIconTint="@color/black"
        app:itemTextColor="@color/black"
        app:menu="@menu/footer" />

</RelativeLayout>

菜单项：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/bacheca"
        android:title="@string/bacheca"
        app:showAsAction="always"
        android:icon="@drawable/bacheca_home"
    />

    <item
        android:id="@+id/cerca"
        android:title="@string/cerca"
        app:showAsAction="always"
        android:icon="@drawable/search_black_24dp"
        />

    <item
        android:id="@+id/nuovo"
        android:title="@string/nuovo"
        android:icon="@drawable/new_post_outlined"
        app:showAsAction="always"
    />

    <item
        android:id="@+id/profilo"
        android:title="@string/profilo"
        android:icon="@drawable/account_circle_black_24dp"
        app:showAsAction="always"
    />

</menu>

整个 activity 在手机上看起来像这样 phone:

在平板电脑上像这样：

希望有人能帮助我。

编辑：感谢用户@GoRoS 解决了BNV左右边缘有空格的问题。只需在 BNV 中添加 android:background="@android:color/holo_orange_dark" 即可解决。

Answer 1

你在提到背景颜色时只是在混淆概念。

app:itemBackground = Default background for each menu item.

android:background = A drawable to use as the background of the view.

Android 正确填充了每个菜单项的 holo_orange_dark 颜色，但是，这并不意味着它将填充整行。为此，只需使用正常的 android:background 属性即可。

这是在BottomNavigationView中加入android:background="@android:color/holo_orange_dark"行后的效果：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
        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=".Navigation">

    <!--Toolbar-->
    <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:background="@color/colorPrimary"
            app:titleTextColor="@color/white"
            android:elevation="4dp" />

    <FrameLayout 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/main_container"
                 android:layout_width="match_parent"
                 android:layout_height="match_parent"
                 android:layout_alignParentStart="true"
                 android:layout_alignParentTop="true"
                 android:layout_marginStart="0dp"
                 android:layout_marginTop="50dp"
                 android:layout_marginBottom="57dp"
                 app:layout_behavior="@string/appbar_scrolling_view_behavior"
                 tools:context=".Navigation">
    </FrameLayout>

    <!--BNV-->
    <android.support.design.widget.BottomNavigationView
            android:id="@+id/footer"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="0dp"
            android:background="@android:color/holo_orange_dark"
            app:elevation="0dp"
            app:itemBackground="@android:color/holo_orange_dark"
            app:itemIconTint="@color/black"
            app:itemTextColor="@color/black"
            app:menu="@menu/footer" />

</RelativeLayout>

这就是您添加该行的结果：

相反，如果您删除它，结果就是您原来的问题：

Answer 2

好吧，我自己设法找到了解决方案，解决这个问题的 XML 属性是

app:itemHorizontalTranslation="false"

默认为 true。这 "expands" 项适合整个宽度。

等于 space 个 BottomNavigationView 的菜单项

Equally space menu items of BottomNavigationView

android

android-xml

android-bottomnav

android-bottom-nav-view