How to show menu item icon without tint color in B

Question

I have created a BottomNavigationView with three items. One of it was user tab.

For the guest tab, there is an image but the TintColor is applying and we can't see that.

So how to remove tint colour for that particular item?

I have tried

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
                            item.setIconTintList(null);

                        }

But no luck. And it applies to above api 26

My activity

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottomNavigationView"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:itemIconTint="@drawable/bottom_color_state"
    app:itemBackground="@color/colorAccent"
    app:itemTextColor="@drawable/bottom_color_state"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:menu="@menu/menu_bottom_navigation" />

bottom_color_state.xml

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:color="@color/white" android:state_enabled="true" />
        <item android:color="@color/colorPrimaryDark" android:state_enabled="false" />
        <item android:color="@color/white" android:state_selected="true" />
        <item android:color="@color/off_white" android:state_selected="false" />
        <item android:color="@color/white" android:state_checked="true" />
        <item android:color="@color/off_white" android:state_checked="false" />
        <item android:color="@color/off_white" />
    </selector>

Thanks in advance

Answer 1

Unlike Skytile said I found that you actually can change the tint of one menu item by using setIconTintMode(null) and you don't need to use setIconTintList

only works with android >= 26

Answer 2

It appears there's no way to change the tint of just one menu item because the BottomNavigationView applies the tint to every item in the list from a wrapper drawable. You'll need to remove the tint list from the nav view and set your tint list on each of your menu item icons individually.

navView.itemIconTintList = null

Then in each of the menu item icons you want to tint, set your color state list on the vector drawable.

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportHeight="24.0"
    android:viewportWidth="24.0">
    <path
        android:fillColor="@color/bottom_color_state"
        android:pathData="M10,20v-6h4v6h5v-8h3L12,3 2,12h3v8z"/>
</vector>

I tested the solution as far back as API 21.

Answer 3

Create a drawable nav_color_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="@android:color/white" />
    <item android:state_pressed="true" android:state_enabled="true" android:color="@android:color/white" />
    <item android:color="@android:color/white" />

replace white with your color

and apply it to Bottom bar

  <android.support.design.widget.BottomNavigationView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:menu="@menu/your_menu"
    app:itemIconTint="@color/nav_color_selector"
    app:itemTextColor="@color/nav_color_selector" />

Answer 4

Add color resource folder in resources and put bottom_color_state in that folder and replace your bottom_color_state code as following

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="@color/white" />
    <item android:state_checked="false" android:color="@color/colorPrimaryDark"/>
</selector>