How do I change a tab background color when using TabLayout?

Issue

This is my code in the main activity

public class FilterActivity extends AppCompatActivity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_filter);

    // Get the ViewPager and set it's PagerAdapter so that it can display items
    ViewPager viewPager  (ViewPager) findViewById(R.id.viewpager);
    PageAdapter pageAdapter  new PageAdapter(getSupportFragmentManager(), FilterActivity.this);
    viewPager.setAdapter(pageAdapter);

    // Give the TabLayout the ViewPager
    final TabLayout tabLayout  (TabLayout) findViewById(R.id.sliding_tabs);
    tabLayout.setupWithViewPager(viewPager);



  }
}

And this is my code in the XML

<LinearLayout xmlns:android"http://schemas.android.com/apk/res/android"
    android:layout_width"match_parent"
    android:layout_height"match_parent"
    android:orientation"vertical">

    <include
        android:id"@+id/app_bar"
        layout"@layout/app_bar">
    </include>

    <android.support.design.widget.TabLayout
        android:id"@+id/sliding_tabs"
        android:layout_width"fill_parent"
        style"@style/MyCustomTabLayout"
        android:layout_height"48dp"/>

    <android.support.v4.view.ViewPager
        android:id"@+id/viewpager"
        android:layout_width"match_parent"
        android:layout_height"0px"
        android:layout_weight"1"
        android:background"@android:color/white" />

</LinearLayout>

I want to change the background color of one tab when it’s selected

Solution

What finally worked for me is similar to what @如果我是DJ suggested, but the tabBackground should be in the layout file and not inside the style, so it looks like:

res/layout/somefile.xml:

<android.support.design.widget.TabLayout
    ....
    app:tabBackground"@drawable/tab_color_selector"
    ...
    />

and the selector res/drawable/tab_color_selector.xml:

<?xml version"1.0" encoding"utf-8"?>
<selector xmlns:android"http://schemas.android.com/apk/res/android">
    <item android:drawable"@color/tab_background_selected" android:state_selected"true"/>
    <item android:drawable"@color/tab_background_unselected"/>
</selector>

Answered By – Tako

Leave a Comment