Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to increase distance between items in BottomBar?

I want to make exactly the same, bottom bar with floating action button. I have used standart BottomNavigationView as well as this library, but I can't increase the distance between items. Is there a way to do that?

enter image description here

enter image description here

like image 732
Dennis Zinkovski Avatar asked Jul 31 '17 03:07

Dennis Zinkovski


3 Answers

This worked for me Just add fifth item with:

<item android:title=""/>

This will add extra spaces between items.

Happy coding.

like image 31
Noor Hossain Avatar answered Nov 18 '22 01:11

Noor Hossain


Add a fifth item to your bottom navigation. Give it an empty string for its label and a completely transparent image for its icon. Also make it disabled. Put this item in the middle position.

The visual effect will be that there's no item in the center of the screen, and the rest of the buttons should be spaced nicely around the floating action button.

like image 112
Ben P. Avatar answered Nov 18 '22 02:11

Ben P.


this is work for me.

<?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>

Output with this code

like image 20
ajay singh Avatar answered Nov 18 '22 02:11

ajay singh