BottomNavigationView Original icon color

Our use case was a multicolored icon when the tab is active and a grey one when it is not. Setting itemIconTintList to null made the inactive tab icons have the same colors as the active ones when using the material component BottomNavigationView.

BottomNavigationView

So we had to do this in addition:

menu_bottom_navigation.xml:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/first_tab"
        android:enabled="true"
        android:icon="@drawable/ic_first_tab_selector"
        android:title="@string/first_tab_title"/>
    <item
        android:id="@+id/second_tab"
        android:enabled="true"
        android:icon="@drawable/ic_second_tab_selector"
        android:title="@string/second_tab_title"/>
</menu>

ic_first_tab_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/ic_first_tab_inactive" android:state_selected="false" />
    <item android:drawable="@drawable/ic_first_tab_active" android:state_selected="true" />
</selector>

Where ic_first_tab_inactive.xml is the drawable for your inactive icon and ic_first_tab_active.xml is the drawable for your active icon.


Here How you would do if you are using Kotlin Find your navigation Id From your Main Activity then in your mainActivity onCreat Use This Code

 my_navigation_item.itemIconTintList = null

You have to make your item icon tint list null, You reach that from your bootomNav :

bottomNavigationView.setItemIconTintList(null);

You are able to use app:itemIconTint from xmlns:app="http://schemas.android.com/apk/res-auto"

For example

<android.support.design.widget.BottomNavigationView
    //...
    app:itemIconTint="@color/gray_scale"
    //...
/>

It is handy when your drawables have different colors