Search code examples
androidbottomnavigationviewmaterial-componentsmaterial-components-androidandroid-bottomnav

How to force BottomNavigationView label to multiline


I have a BottomNavigationView with a long label text and it's not showing the full label.

I found that the label on BottomNavigationView has a maxLines="1", but I don't know how to modify it to allow 2 lines label.


Solution

  • Currently there isn't a way to change the android:maxLines="1" used by the items in BottomNavigationMenuView.

    It is a workaround and it can stop to work with the future releases.

    BottomNavigationMenuView menuView = (BottomNavigationMenuView) bottomNavigationView.getChildAt(0);
    
    for (int i = 0; i < menuView.getChildCount(); i++) {
          BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
          TextView smallLabel = item.findViewById(R.id.smallLabel);
          TextView largeLabel = item.findViewById(R.id.largeLabel);
    
          smallLabel.setMaxLines(2);
          largeLabel.setMaxLines(2);
    }
    

    Just to explain.
    It is the layout used by the BottomNavigationView. Here you can find:

    <merge xmlns:android="http://schemas.android.com/apk/res/android">
      <ImageView
          android:id="@+id/icon"
          ../>
      <com.google.android.material.internal.BaselineLayout
        ..>
        <TextView
            android:id="@+id/smallLabel"
            android:maxLines="1" 
            ../>
        <TextView
            android:id="@+id/largeLabel"
            android:maxLines="1"
            .../>
      </com.google.android.material.internal.BaselineLayout>
    </merge>