BottomNavigationBar-change the tab icon color

Question

I've integrated Bottom Bar Navigation bar on my app. But when I swipe, tab's color doesn't change. It's weird cause I have selector file. Any idea to solve this problem?

Activity.java

BottomNavigationView bottomNavigationView = (BottomNavigationView)
            findViewById(R.id.bottom_navigation);


    bottomNavigationView.setOnNavigationItemSelectedListener(
            new BottomNavigationView.OnNavigationItemSelectedListener() {
                @Override
                public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                    switch (item.getItemId()) {
                        case R.id.bb_menu_arac:
                            fragment = new AraclarimFragment();
                            break;
                        case R.id.bb_menu_yaklasan:
                            fragment = new YaklasanlarFragment();
                            break;
                        case R.id.bb_menu_yakin:
                            fragment = new Yakinimdakiler();
                            break;

                    }
                    final FragmentTransaction transaction = fragmentManager.beginTransaction();
                    transaction.replace(R.id.main_container, fragment).commit();
                    return true;
                }


            });

selector.xml

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

activiy.xml

<android.support.design.widget.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    app:itemBackground="@color/colorPrimary"
    app:itemIconTint="@color/beyaz"
    app:itemTextColor="@color/beyaz"
    app:menu="@menu/bottombar_menu" />

You've written in code that **androida:state_enabled** instead of **android:state_enabled** ?? Is that making problem? — Queendevelopers, Feb 20 '17 at 14:21
@AnuragSingh ActualIy, I have no idea where should I use or call selector.xml — Yunus Haznedar, Feb 20 '17 at 14:26
@YunusHaznedar you want to change text color for selected item or background of selected item? — Queendevelopers, Feb 20 '17 at 14:36

score 60 · Accepted Answer · answered Feb 20 '17 at 14:37

60

Change to app:itemIconTint="@drawable/selector"

Also change your selector.xml to this:

<?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/beyaz" />
<item android:color="@color/colorPrimaryDark"  />
</selector>

answered Feb 20 '17 at 14:37

Anurag Singh

6,140
2
31
47

changing `android:color` to `android:drawable` was the point for me – MHSaffari Jan 01 '19 at 13:49

score 10 · Answer 2 · answered Dec 30 '20 at 07:23

I was confused about whole process despite reading all the answers, so here is how I resolved it step by step so beginners can understand it properly

Let's say you created MainActivity with bottom navigation so

in your drawable folder create bottom_navigation_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="@color/yourSelectedColor" />
  <item android:color="@color/defaultColor"  />
</selector>

then go to the activity_main.xml layout and add this line in BottomNavigationView

app:itemIconTint="@drawable/bottom_navigation_selector"

If you also want to change text color accordingly then you need to add this line aswell

app:itemTextColor="@drawable/bottom_navigation_selector"

score 4 · Answer 3 · answered Feb 20 '17 at 14:34

You have to set selector as itemIconTint of your BottomNavigationView. Something like

 <android.support.design.widget.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    app:itemBackground="@color/colorPrimary"
    app:itemIconTint="@drawable/selector"
    app:itemTextColor="@color/beyaz"
    app:menu="@menu/bottombar_menu" />

score 1 · Answer 4 · answered Jun 03 '22 at 09:58

1

I use way @Anurag Singh, but it didn't work until I removed this line:

navigation?.itemIconTintList = null

Thank myself.

answered Jun 03 '22 at 09:58

nicolas asinovich

3,201
3
27
37

score 1 · Answer 5 · answered Aug 25 '22 at 12:26

1

Just add: item.setChecked(true);

inside each case;

answered Aug 25 '22 at 12:26

Lucky Amos

156
1
5

BottomNavigationBar-change the tab icon color

5 Answers5

Linked