Francislainy Campos
Francislainy Campos

Reputation: 4136

How to add second line to text on bottom bar for Android?

I'm trying to have my text go down to a second line so it's not cut off but not sure whether this is possible using the Google MaterialBottomBar? Something like the image below please.

enter image description here

But this is what I have:

enter image description here

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNav"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/white"
        app:labelVisibilityMode="labeled"
        app:itemIconTint="@drawable/nav_items_color"
        app:itemTextColor="@drawable/nav_items_color"
        app:menu="@menu/bottom_menu_nav" />

Thank you.

Upvotes: 2

Views: 1789

Answers (2)

Zain
Zain

Reputation: 40810

This is just a hint to @chand mohd answer to have the text centered like that you would like to have.

So, besides android:lines, add the android:gravity attribute to have a centered text

<style name="BottomNavigationStyle">
     <item name="android:gravity">center</item>
     <item name="android:lines">2</item>
</style>

Upvotes: 4

chand mohd
chand mohd

Reputation: 2550

Add a style to BottomNavigation in style.xml

<style name="BottomNavigationStyle">
        <item name="android:lines">2</item>
    </style>

And then use above style in your xml

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNav"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/white"
        app:labelVisibilityMode="labeled"
        app:itemIconTint="@drawable/nav_items_color"
        app:itemTextColor="@drawable/nav_items_color"
        android:theme="@style/BottomNavigationStyle"
        app:menu="@menu/bottom_menu_nav" />

Upvotes: 6

Related Questions