How to change color of Selected Tab

Question

How to change color of tab when its selected, see below screen shot:

i am showing Orange color in ActionBar, in a same way i wanna show orange color in place of ligh

Answer 1

Create an selector file which consist your desire color apply on tab xml like below:

 <?xml version="1.0" encoding="utf-8"?>
        <!-- 
        Copyright (c) Josh Clemm 2010
         -->
    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <!--  Active tab -->
        <item android:state_selected="true" android:state_focused="false"
        android:state_pressed="false" android:drawable="@drawable/dm_tab_highlight" />
        <!--  Inactive tab -->
    <!--    <item android:state_selected="false" android:state_focused="false" -->
    <!-- android:state_pressed="false" android:drawable="@drawable/tabbarbg" /> -->

        <!--  Pressed tab -->
        <item android:state_pressed="true" android:drawable="@drawable/dm_tab_highlight" />


    </selector> 

Answer 2

I really recommend you to use the Actionbar Style Generator.

With that tool you can easily theme your graphic elements in your toolbar.

Answer 3

You can use this code and set icon alpha , it look like one is selected and other are disable.

viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    }

    @Override
    public void onPageSelected(int position) {
        switch (position) {
            case 0:
                tabLayoutUserProfileTabs.getTabAt(0).getIcon().setAlpha(255);
                tabLayoutUserProfileTabs.getTabAt(1).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(2).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(3).getIcon().setAlpha(128);
                break;
            case 1:
                tabLayoutUserProfileTabs.getTabAt(0).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(1).getIcon().setAlpha(255);
                tabLayoutUserProfileTabs.getTabAt(2).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(3).getIcon().setAlpha(128);
                break;
            case 2:
                tabLayoutUserProfileTabs.getTabAt(0).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(1).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(2).getIcon().setAlpha(255);
                tabLayoutUserProfileTabs.getTabAt(3).getIcon().setAlpha(128);
                break;
            case 3:
                tabLayoutUserProfileTabs.getTabAt(0).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(1).getIcon().setAlpha(128);
                tabLayoutUserProfileTabs.getTabAt(2).getIcon().setAlpha(128);
             tabLayoutUserProfileTabs.getTabAt(3).getIcon().setAlpha(255);
                break;
        }
    }

    @Override
    public void onPageScrollStateChanged(int state) {
    }
});

Answer 4

Use this line app:tabSelectedTextColor="@color/colorPrimaryDark" in your xml

<com.google.android.material.tabs.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        app:tabMode="scrollable"
        android:layout_alignParentBottom="true"
        app:tabSelectedTextColor="@color/colorPrimaryDark"
        app:tabIndicatorColor="@color/colorPrimaryDark"

        >
    </com.google.android.material.tabs.TabLayout>

Answer 5

myTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener(){
  @Override
  public void onTabChanged(String tabId) {
    int tab = myTabHost.getCurrentTab();
    View view = myTabHost.getTabWidget().getChildAt(tab).setBackgroundColor(Color.CYAN);
  }
});

Answer 6

To change tab bar background:

actionBar.setStackedBackgroundDrawable(new ColorDrawable(yourOwnColor));