More than 3 items in bottom navigation bar android

Question

I am new to android and I am trying to make an app with more than 3 elements in the bottom navigation bar. I am able to display them but they are getting clustered at the end and only three are visible properly. Here is my code:

<android.support.design.widget.BottomNavigationView
    android:id="@+id/bottomNavigation"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:elevation="15dp"
    android:layout_gravity="bottom"
    android:layout_alignParentBottom="true"
    app:menu="@menu/bottom_nav_items" />

Here is the image of the view: This is the snapshot

I am stuck please help..

The selected item will always have a larger amount of space (given that it has to show the title). When you select another element does it expand? — ianhanniballake, Feb 15 '17 at 00:24

score 20 · Answer 1 · answered May 25 '17 at 10:29

You can use below method for not getting clustered menu items. You have to call this method in onCreate method passing BottomNavigationView.

// Method for disabling ShiftMode of BottomNavigationView
private void disableShiftMode(BottomNavigationView view) {
    BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
    try {
        Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
        shiftingMode.setAccessible(true);
        shiftingMode.setBoolean(menuView, false);
        shiftingMode.setAccessible(false);
        for (int i = 0; i < menuView.getChildCount(); i++) {
            BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
            item.setShiftingMode(false);
            // set once again checked value, so view will be updated
            item.setChecked(item.getItemData().isChecked());
        }
    } catch (NoSuchFieldException e) {
        Log.e("BNVHelper", "Unable to get shift mode field", e);
    } catch (IllegalAccessException e) {
        Log.e("BNVHelper", "Unable to change value of shift mode", e);
    }
}

Thanks. I'm glad I helped someone..@a.g.thamays – Maulik Dodia Jun 06 '17 at 04:01 — Maulik Dodia, Jun 06 '17 at 04:01

score 4 · Accepted Answer · answered Mar 04 '17 at 19:26

I am not sure, but to my knowledge, it is not possible to accompany more than 3 items using the bottom bar, without distorting the alignment. What you can do anyways is make a linear layout with horizontal orientation, and in that set those icons as image views and then make their weight as 1.

Here is the code,

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:gravity="center"
    android:layout_alignParentBottom="true"
    android:background="#fff">

        <ImageView
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:src="(YOUR IMAGE SOURCE)"
            android:layout_centerVertical="true"
            android:layout_centerHorizontal="true"
            android:layout_weight="1"/>

And then other image views like this.

score 2 · Answer 3 · answered Dec 19 '17 at 05:17

     <android.support.design.widget.BottomNavigationView
            android:id="@+id/navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:background="?android:attr/windowBackground"
            app:menu="@menu/navigation" />


navigation.xml(inside menu)
<?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/navigation_home"
        android:icon="@drawable/ic_home_black_24dp"
        android:title="@string/title_home"
        app:showAsAction="always|withText"
        android:enabled="true"/>

    inside oncreate method
     BottomNavigationView navigation = (BottomNavigationView)findViewById(R.id.navigation);
      BottomNavigationViewHelper.disableShiftMode(navigation);//Dont forgot this line




    public class BottomNavigationViewHelper {
        public static void disableShiftMode(BottomNavigationView view) {
            BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
            try {
                Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
                shiftingMode.setAccessible(true);
                shiftingMode.setBoolean(menuView, false);
                shiftingMode.setAccessible(false);
                for (int i = 0; i < menuView.getChildCount(); i++) {
                    BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
                    //noinspection RestrictedApi
                    item.setShiftingMode(false);
                    // set once again checked value, so view will be updated
                    //noinspection RestrictedApi
                    item.setChecked(item.getItemData().isChecked());
                }
            } catch (NoSuchFieldException e) {
                Log.e("BNVHelper", "Unable to get shift mode field", e);
            } catch (IllegalAccessException e) {
                Log.e("BNVHelper", "Unable to change value of shift mode", e);
            }
        }
    }

perfect, it works for me, but I have to put @SuppressLint("RestrictedApi") this annotation in a helper class. is it good practice? — Vrajesh, Feb 28 '18 at 13:12

More than 3 items in bottom navigation bar android

3 Answers3

Linked