Search code examples
androidandroid-fragmentsandroid-tablayoutbottomnavigationviewandroid-bottomnav

Bottom Navigation Bar not showing icons or text


I'm having a little bit of trouble trying to implement a Bottom Navigation Bar with icons and text in my Android application.
The bar currently functions as expected and takes you to the desired fragment but isn't showing icons or text for some reason.

I've done a few searches but haven't been able to find a solution or a reason as to why it is behaving this way.
Any help would be appreciated. Thanks.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <FrameLayout
        android:id="@+id/frame_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <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:itemBackground="@color/turquoise"
        android:foreground="@color/colorPrimary"
        app:itemIconTint="@android:color/white"
        app:itemTextColor="@android:color/white"
        app:menu="@menu/navigation" />

</android.support.design.widget.CoordinatorLayout>

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_0"
        android:icon="@drawable/ic_launcher_foreground"
        android:title="home"
        app:showAsAction="ifRoom|withText"/>

    <item
        android:id="@+id/nav_1"
        android:icon="@drawable/ic_launcher_foreground"
        android:title="email"
        app:showAsAction="ifRoom|withText"/>

    <item
        android:id="@+id/nav_2"
        android:icon="@drawable/ic_home"
        android:title="profile"
        app:showAsAction="ifRoom|withText"/>

    <item
        android:id="@+id/nav_3"
        android:icon="@drawable/ic_home"
        android:title="map"
        app:showAsAction="ifRoom|withText"/>

</menu>

in MainActivity.java

 toolbar = getSupportActionBar();

        BottomNavigationView navigation = (BottomNavigationView) findViewById(R.id.navigation);
        navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);

Solution

  • Remove android:foreground="@color/colorPrimary" attribute inside your BottomNavigationView