I need to hide title of items in bottom navigation bar

Maysa Khamis picture Maysa Khamis · Feb 7, 2018 · Viewed 8.2k times · Source

I create bottom navigation bar and i need to hide title and show icons only but when i write title with empty string there is big space between icon and bottom it just replace string with empty string and i make many search but i don't found solutions so any help

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.easyschools.student.HomeActivity">

<FrameLayout
    android:id="@+id/main_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/navigation"
    android:layout_alignParentTop="true">
 </FrameLayout>

<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginEnd="0dp"
    android:layout_marginStart="0dp"
    android:background="@android:color/white"
    android:layout_alignParentBottom="true"
    app:menu="@menu/navigation"/>

</RelativeLayout>

navigation.xml

<?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/nav_messages"
        android:icon="@drawable/msg_icon"
        android:title=""/>

    <item
        android:id="@+id/nav_home"
        android:icon="@drawable/home_icon"
        android:title=""
        android:checked="true"/>

    <item
        android:id="@+id/nav_notify"
        android:icon="@drawable/notify_icon"
        android:title=""/>

    <item
        android:id="@+id/nav_my_profile"
        android:icon="@drawable/user_icon"
        android:title=""/>
</menu>

Answer

Nongthonbam Tonthoi picture Nongthonbam Tonthoi · Jul 11, 2018

Starting from support library 28.0.0-alpha1, you can use:

app:labelVisibilityMode="unlabeled"

to hide title and

app:itemHorizontalTranslationEnabled="false"

add:

xmlns:app="http://schemas.android.com/apk/res-auto"

to disable shift mode to your BottomNavigationView in xml