'How to change selected Tab Text color using TabLayout from code in Android?

enter image description here

I'm using android.support.widget.TabLayout to make a Tab view, and I want to change the selected tabs text color from code (not from xml or by styling). How can I do this ?



Solution 1:[1]

If you are using the design support library add this code to your tab activity.

tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FF0000"));
tabLayout.setSelectedTabIndicatorHeight((int) (5 * getResources().getDisplayMetrics().density));
tabLayout.setTabTextColors(Color.parseColor("#727272"), Color.parseColor("#ffffff"));

This will set the tab text color as well as tab indicator color in your tab activity.

Solution 2:[2]

It's so simple using XML. Just add the following 2 attributes in your tab layout.

app:tabSelectedTextColor="@color/color_primary_text"
app:tabTextColor="@color/color_secondary_text"

So, your code would look something like this.

<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true"
    android:layout_gravity="bottom"
    android:background="@color/button_background"
    android:fillViewport="true"
    app:tabBackground="@drawable/fixed_bottom_button"
    app:tabIndicatorColor="@color/color_primary_text"
    app:tabMode="fixed"
    app:tabSelectedTextColor="@color/color_primary_text"
    app:tabTextColor="@color/color_secondary_text" />

Solution 3:[3]

Please check out following answer

 tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            View view = tab.getCustomView();
            RelativeLayout relativeLayout = (RelativeLayout) view.findViewById(R.id.layout_background);
            relativeLayout.setBackgroundColor(ContextCompat.getColor(getActivity(), R.color.white));
            TypefacedTextView selectedText = (TypefacedTextView) view.findViewById(R.id.txt_tab_name);
            selectedText.setTextColor(ContextCompat.getColor(getActivity(), R.color.colorPrimary));

        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {
            View view = tab.getCustomView();
            RelativeLayout relativeLayout = (RelativeLayout) view.findViewById(R.id.layout_background);
            relativeLayout.setBackgroundColor(ContextCompat.getColor(getActivity(), R.color.colorPrimary));
            TypefacedTextView selectedText = (TypefacedTextView) view.findViewById(R.id.txt_tab_name);
            selectedText.setTextColor(ContextCompat.getColor(getActivity(), R.color.white));
        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {

        }
    });

where tabLayout is object of TabLayout Class

Solution 4:[4]

It's better if you update the library with "com.google.android.material:material:1.0.0". Then use bellow code,

In XML attributes

<com.google.android.material.tabs.TabLayout
                    android:id="@+id/tab_layout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:tabIndicatorColor="@color/white"
                    app:tabBackground="@color/colorAccent"
                    app:tabSelectedTextColor="@color/white"
                    app:tabTextColor="@color/white"
                    app:tabMode="scrollable" />

In Kotlin programmatically

(tab_layout as TabLayout).setBackgroundColor(ContextCompat.getColor(mContext, R.color.colorPrimary))
(tab_layout as TabLayout).setSelectedTabIndicatorColor(ContextCompat.getColor(mContext, R.color.white))
(tab_layout as TabLayout).setTabTextColors(ContextCompat.getColor(mContext, R.color.white),
                ContextCompat.getColor(mContext, R.color.white))

Solution 5:[5]

I know this might be a bit late but here is more simpler code :

tabLayout.setTabTextColors(getResources().getColor(R.color.blue_200), getResources().getColor(R.color.white));

first value is the default text color, 2nd value is the selected tab text color.

Solution 6:[6]

tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FF0000"));
tabLayout.setSelectedTabIndicatorHeight((int) (5 * getResources().getDisplayMetrics().density));
tabLayout.setTabTextColors(Color.parseColor("#727272"), Color.parseColor("#ffffff"));

Solution 7:[7]

Just write it in xml

app:tabSelectedTextColor="@color/my_color"

Worked for me

Solution 8:[8]

Using native android code you can chage multiple tab background & text color

LinearLayout tabsContainer = (LinearLayout) tabLayout.getChildAt(0);
        for (int i = 0; i < tabLayout.getTabCount(); i++) {
            for (int j = 0; j <= selectedTab.size(); j++) {
                if (selectedTab.contains(section)) {
                    LinearLayout item = (LinearLayout) tabsContainer.getChildAt(section - 1);
                    TextView tv = (TextView) item.getChildAt(1);
                    item.setBackgroundColor(getResources().getColor(R.color.color00DF4C));
                    tv.setTextColor(getResources().getColor(R.color.colorWhite));
                }
            }
        }

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Morteza Jalambadani
Solution 2
Solution 3 Swapnil Kshirsagar
Solution 4 Md Imran Choudhury
Solution 5 hossam scott
Solution 6 Pang
Solution 7 Vahit Keskin
Solution 8 Radhika bajaj