Support library BottomNavigationView not showing icons

Question

I'm using Android support design widget BottomNavigationView for making my bottom navigation items. It doesn't show the icons, but it shows text and is working fine. I am using the support library version com.google.android.material:material:1.4.0 and my XML code for bottomnavigationView is:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    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"
    android:background="@color/white"
    tools:context=".MainActivity">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@drawable/gradient_bg"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="@dimen/_30sdp">

            <ImageView
                android:layout_width="@dimen/_55sdp"
                android:layout_height="@dimen/_35sdp"
                android:src="@drawable/logo1" />

        </LinearLayout>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="@dimen/_54sdp"
            android:gravity="center"
            android:text=""
            android:textColor="@color/white"
            android:textSize="@dimen/_12sdp" />
    </androidx.appcompat.widget.Toolbar>

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/layout"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toolbar" />

    <LinearLayout
        android:id="@+id/layout"
        android:layout_width="match_parent"
        android:layout_height="@dimen/_45sdp"
        android:layout_weight="0.90"
        android:background="@color/app_col1"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        android:gravity="center"
        android:orientation="vertical">

        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_nav_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/app_col1"
            app:itemIconTint="@color/white"
            app:labelVisibilityMode="labeled"
            android:layout_gravity="center"
            android:theme="@style/Theme.App"
            app:itemTextColor="@drawable/tab_color"
            app:menu="@menu/bottom_navigation_menu"/>

    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

My menu XML code is below

<?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/page_1"
        android:enabled="true"
        android:iconTint="@drawable/ic_baseline_home_24"
        app:showAsAction="ifRoom"
        android:title="Home"/>
    <item
        android:id="@+id/page_2"
        android:iconTint="@drawable/ic_baseline_home_24"
        app:showAsAction="withText"
        android:title="Category"/>
    <item
        android:id="@+id/page_3"
        app:showAsAction="ifRoom"
        android:iconTint="@drawable/user"
        android:title="Profile"/>
</menu>

How can I solve this issue?

Answer 1

In your activity layout add the following code.

  <com.google.android.material.bottomnavigation.BottomNavigationView
                        android:id="@+id/btmMenu"
                        android:layout_width="match_parent"
                        android:layout_height="50dp"
                        android:layout_alignParentBottom="true"
                        app:itemIconSize="@dimen/bottom_navigation_icon_size"
                        app:labelVisibilityMode="labeled"
                        android:background="@color/white_color"
                        app:menu="@menu/menu"
                        app:elevation="0dp"></com.google.android.material.bottomnavigation.BottomNavigationView>
    

Create a menu.xml file and add the below code.

    <?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android">
    
        <item
            android:id="@+id/Home"
            android:title="Home"
            android:icon="@drawable/home_selector"/>
    
        <item
            android:id="@+id/Statistics"
            android:title="Statistics"
            android:icon="@drawable/statitics_selector"/>
    
        <item
            android:id="@+id/Analytics"
            android:title="Analytics"
            android:icon="@drawable/analytics_selector"/>
    
        <item
            android:id="@+id/Profile"
            android:title="Profile"
            android:icon="@drawable/profile_selector"/>
    </menu>