CODEWITHSUNDEEP
androidandroid-layoutandroid-tablayout
dbenitobaldeon
dbenitobaldeon

Reputation: 324

Change color of TabLayout selected in Android Studio

I'm new to the Android Studio and on this page, I need to know how to change the color when a tab is selected.

I've tried from the design but I'm not successful. Here is the code:

android:id="@+id/tab_layout_home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/logo_home"
android:background="@null"
android:visibility="visible"
app:layout_scrollFlags="enterAlways"
app:tabGravity="center"
app:tabPaddingBottom="0dp"
app:tabPaddingEnd="@dimen/content_inset_half"
app:tabPaddingStart="@dimen/content_inset_half"
app:tabPaddingTop="0dp"
app:tabTextColor="@color/tab_text_color_selector"
app:tabSelectedTextColor="@color/colorWindowsBackgroundLight"

Upvotes: 2

Views: 484

Answers (3)

dbenitobaldeon
dbenitobaldeon

Reputation: 324

Well, thanks for the support with your answers, I used a lot of all the information I found, but the problem was that I was not using a setText() in the getTabAt() method,I was using a setCustomView() which was a custom view in an xml, that's why it did not change color or the tabSelectedTextColor() methods did not work obviously. Just remove the custom design and use the native one manually entering the title for the tabs and with this I worked.

Upvotes: 0

olajide
olajide

Reputation: 967

I'll assume you are using a support library.

1...You can simply do this in your code like this: 

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

2...You can, as well, do this in your xml. Add the following to your tab

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

Your tablayout in xml will finally look like this

android:id="@+id/tab_layout_home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/logo_home"
android:background="@null"
android:visibility="visible"
app:layout_scrollFlags="enterAlways"
app:tabGravity="center"
app:tabPaddingBottom="0dp"
app:tabPaddingEnd="@dimen/content_inset_half"
app:tabPaddingStart="@dimen/content_inset_half"
app:tabPaddingTop="0dp"
app:tabTextColor="@color/tab_text_color_selector"
app:tabSelectedTextColor="@color/colorWindowsBackgroundLight"
app:tabSelectedTextColor="@color/color_primary_text"
app:tabTextColor="@color/color_secondary_text" />

Upvotes: 1

Android Geek
Android Geek

Reputation: 9225

Try this:

xml code Tab layout

<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" />

Add two attributes in your tab layout like this

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

Java Code

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

it helps you

Upvotes: 0

Related Questions