如何增加 BottomBar 中项目之间的距离？

Question

我想制作完全相同的带有浮动操作按钮的底部栏。我使用了标准的 BottomNavigationView 以及这个 library，但我无法增加项目之间的距离。有办法吗？

Answer 1

向底部导航添加第五个项目。为其标签指定一个空字符串，为其图标指定一个完全透明的图像。也将其禁用。将此项放在中间位置。

视觉效果是屏幕中央没有任何项目，其余按钮应该很好地围绕浮动操作按钮间隔开。

Answer 2

这对我有用。

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

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

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:layout_alignParentBottom="true"
        android:layout_gravity="bottom"
        android:background="@color/colorAccent" />
</RelativeLayout>

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:backgroundTint="@color/white"
    android:scaleType="center"
    app:fabSize="normal"
    app:layout_anchor="@+id/bottom_navigation"
    app:layout_anchorGravity="top|center_horizontal" />

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

Answer 3

这对我有用只需添加第五项：

<item android:title=""/>

这将在项目之间添加额外的空格。

编码愉快。

Answer 4

添加第 5 项，然后以编程方式禁用它

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottomAppBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:backgroundTint="@color/colorSecondary"
        app:fabCradleMargin="6dp"
        app:fabCradleRoundedCornerRadius="20dp"
        app:fabCradleVerticalOffset="1dp">


            <com.google.android.material.bottomnavigation.BottomNavigationView
                android:id="@+id/nav_view"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@android:color/transparent"
                app:labelVisibilityMode="labeled"
                android:layout_marginEnd="16dp"
                app:itemIconTint="@drawable/tab_color"
                app:itemTextColor="@drawable/tab_color"
                app:menu="@menu/bottom_nav_menu" />



    </com.google.android.material.bottomappbar.BottomAppBar>

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab_start_exercise"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/title_start"
        app:tint="?colorOnPrimary"
        android:theme="@style/FabButtonTheme"
        app:maxImageSize="45dp"
        android:src="@drawable/ic_run"
        app:layout_anchor="@id/bottomAppBar" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

        <?xml version="1.0" encoding="utf-8"?>
        <menu xmlns:android="http://schemas.android.com/apk/res/android">
        
            <item
                android:id="@+id/navigation_home"
                android:icon="@drawable/ic_home"
                android:title="@string/title_home" />
        
            <item
                android:id="@+id/navigation_plan"
                android:icon="@drawable/ic_plan"
                android:title="@string/title_plan" />
            <item
                android:id="@+id/navigation_placeholder"
                android:title="" />
        
            <item
                android:id="@+id/navigation_diet"
                android:icon="@drawable/ic_diet"
                android:title="@string/title_diet" />
        
            <item
                android:id="@+id/navigation_profile"
                android:icon="@drawable/ic_profile"
                android:title="@string/title_profile" />
            
        </menu>
    
    
    
    private fun disableCenterItem(){
           val navView = findViewById(R.id.nav_view)
           val menuNav = navView.menu
           val placeHolderItem = menuNav.findItem(R.id.navigation_placeholder)
           placeHolderItem.isEnabled = false
        }

Answer 5

请在您的菜单中添加 xml 如下所示的第 3 个位置项目

  <item
    android:id="@+id/page_3"
    android:enabled="false"
    android:title=""
  />

如何增加 BottomBar 中项目之间的距离？

How to increase distance between items in BottomBar?

android

bottombar