Search code examples
background-colorandroid-tablayout

Android - How to change the background color or the entire TabLayout dynamically?

I need to change the background color of my entire tab layout dynamically through code in my app. I just need to know the correct line to type. I don't need to change the selected tab or anything. I want to leave the style and text colors and the indicator line as is. I just want to change the background of the entire tab layout dynamically in code. Thank you for your help.

I have already tried the below line of code. Didn't work. Also included my TabLayout XML.

private TabLayout mTabLayout;
mTabLayout = (TabLayout) findViewById(R.id.tabs);

mTabLayout.setBackgroundColor
(this.getResources().getColor(R.color.dark_grey));

<android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        style="@style/CategoryTab"
        android:layout_width="match_parent"
        android:layout_height="@dimen/activity_generic_margin_28"
        app:tabBackground="@color/app_bar"/>

Thank you for your help.

Solution

  • I solved it by checking the boolean that I have set for night theme prior to setting the content view in onCreate. 

    @Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    SharedPreferences nightModeSwitchState = getSharedPreferences("NightModeSwitchState", 0);
    mNightModeSwitchState = nightModeSwitchState.getBoolean("NightModeSwitchState", false);

    if (mNightModeSwitchState) {
        setContentView(R.layout.activity_book_night);
    } else {
        setContentView(R.layout.activity_book);
    }

    I have two layouts made both include tabLayouts. One of them references a style file for tabLayout set to night mode colors with the dark background and the layout references a style file set to regular colors for the tablayout.

    <style name="CategoryTab" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@android:color/white</item>
    <item name="tabSelectedTextColor">@android:color/white</item>
    <item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
    <item name="tabBackground">@drawable/tab_regular_theme</item>
    <item name="android:textColorSecondary">@android:color/white</item>
</style>

<style name="CategoryTabNight" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@android:color/white</item>
    <item name="tabSelectedTextColor">@android:color/white</item>
    <item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
    <item name="tabBackground">@drawable/tab_layout_dark_mode</item>
    <item name="android:textColorSecondary">@android:color/white</item>
</style>

    The style files reference different drawables that control the background colors as you can see above.. and here are the drawables...

    Here is night mode drawable:

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

    Here is regular mode drawable:

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

    Everything else is the layouts are identical as not to mess anything up just the style files for the tablayouts are changed. I hope this makes sense. I tested it and it works for me. I have tried so many other things and nothing worked. It is important to call Shared Preference to get the value before checking the boolean. I hope this helps someone.