root337
root337

Reputation: 35

How to change the tab text colour for com.google.android.material.tabs.TabItem

Hello im using this tab layout com.google.android.material.tabs.TabItem and im trying to change the colour of the text from black to white but im not sure how to change tab text colours in general.

xml code:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@drawable/gradient"
tools:context=".GuestTab">

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabMode"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    >

    <com.google.android.material.tabs.TabItem
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:id="@+id/Tab1"
        android:text="@string/tab_text_1"
        />

    <com.google.android.material.tabs.TabItem
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:id="@+id/Tab2"
        android:text="@string/tab_text_2"
        />

    <com.google.android.material.tabs.TabItem
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:id="@+id/Tab3"
        android:text="@string/tab_text_3"
        />
</com.google.android.material.tabs.TabLayout>

<androidx.viewpager.widget.ViewPager
    android:id="@+id/viewpager"
    android:layout_height="wrap_content"
    android:layout_width="match_parent">
</androidx.viewpager.widget.ViewPager>


</LinearLayout>

This is what the text colour looks like at the moment: tabs

Upvotes: 1

Views: 1980

Answers (2)

jeevan s
jeevan s

Reputation: 631

Try something like this.

  <com.google.android.material.tabs.TabLayout
        app:tabTextColor="@color/white"

the tab layout is transparent so you might just mess with the background(of the View Pager) to get your desired effect.

If you want to change the indicator color, try this:

        app:tabIndicatorColor="@color/white" 

Upvotes: 1

ihaydinn
ihaydinn

Reputation: 197

You can try this code.

tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FF0000"));
tabLayout.setBackgroundColor(Color.parseColor("#008577"));
tabLayout.setTabTextColors(Color.parseColor("#727272"),Color.parseColor("#D81B60"));

Upvotes: 1

Related Questions