Layout elements background color changes when app resumes after backpress

Issue

I have activity which has two fragments. Activity contains TabLayout only (2tabs) where these two fragments fill up the tabs body.

Everything works when I first start the app, all colors are correctly loaded from colors.xml. When I press backpress button (tried in 2 emulators and also real device, API from 23 to 28), and I reopen the app, color (#222222) of the active tab and also color (#222222) of other elements everywhere in the fragment changes to the primary color which is colorAccent: @color/green in my case. And this green color is loaded normally. Other colors in the app do NOT change at all, they stay as they are defined.

I spent 6 hours debugging this problem, I have no clue, why other colors stay as they should.

I have experimented and added a new activity which starts when I click on button in the fragment and I set this activity background color to the same #222222 which defined in my colors.xml as <color name="darkg">#222222</color>.

The background in this activity is always green, even after I start the app normally (not resuming) while the active tab button is darkg color.

This is how I start my framgent from their parent activity:

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

    fm = getSupportFragmentManager();

    // Create the adapter that will return a fragment for each of the three
    // primary sections of the activity.
    mSectionsPagerAdapter = new SectionsPagerAdapter(fm);

    // Set up the ViewPager with the sections adapter.
    mViewPager = findViewById(R.id.container);
    mViewPager.setAdapter(mSectionsPagerAdapter);

    TabLayout tabLayout = findViewById(R.id.tabs);

    mViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
    tabLayout.addOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(mViewPager));

}

public class SectionsPagerAdapter extends FragmentPagerAdapter {

    public SectionsPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        switch (position){
            case 0:
                return watchList;
            case 1:

                return exbook;
            default:
                return null;
        }
    }`

I have tried to remove some dependencies which I thought can cause this problem, I have cleaned project enormous number of times, I have invalidated caches and restarted android studio, nothing ever helped.

My app is supported from Android 5.0, I tried to test it on emulator with API 23, tab color doesn't change there, only other elements in the fragment. On the other hand, I tested on emulator with API 28 and also real device API 28, and tab button changes to green also with other elements in fragment + that activity is always green.

I should also mention, that in my fragment, I have recyclerview and I have alternate rows background color set like this (it is set in Adapter.class, and this color works always, never changes to green:

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
    //holder.textViewPos.setText("#" + (position + 1));
    holder.swipeLayout.setOffset(itemsOffset[position]);
    //((RecyclerView.LayoutParams) holder.itemView.getLayoutParams()).height = 300;
    if(position %2 == 1)
    {
        holder.itemView.setBackgroundColor(Color.parseColor("#222222"));

        //  holder.imageView.setBackgroundColor(Color.parseColor("#FFFFFF"));
    }
    else
    {
        holder.itemView.setBackgroundColor(Color.parseColor("#2B2B2B"));
        //  holder.imageView.setBackgroundColor(Color.parseColor("#FFFAF8FD"));
    }
}

XML file for activity, where I have TabLayout:

<androidx.coordinatorlayout.widget.CoordinatorLayout 
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:id="@+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".InsideActivity">

<com.google.android.material.appbar.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/appbar_padding_top"
    android:background="#fff">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="match_parent"
            android:layout_height="52dp"
            android:layout_marginTop="8dp"
            android:layout_marginBottom="15dp"
            android:layout_weight="1"
            app:layout_constraintVertical_bias="1.0"
            app:srcCompat="@drawable/logo" />
    </androidx.constraintlayout.widget.ConstraintLayout>

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="65dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:tabBackground="@drawable/tab_color_selector"
        app:tabIndicator="@color/darkg">

        <com.google.android.material.tabs.TabItem
            android:id="@+id/tabItem"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Watchlist" />

        <com.google.android.material.tabs.TabItem
            android:id="@+id/tabItem2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Exbook" />

    </com.google.android.material.tabs.TabLayout>
</com.google.android.material.appbar.AppBarLayout>

<com.me.appka.NonSwipeableViewPager
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">
</com.me.appka.NonSwipeableViewPager>

Fragment XML:

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

<Button
    android:id="@+id/addToWatchlist"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/darkg"
    android:fontFamily="sans-serif"
    android:gravity="center_vertical"
    android:includeFontPadding="true"
    android:onClick="onClickAddNewPerson"
    android:text="ADD NEW"
    android:textAlignment="center"
    android:textColor="@color/details_text"
    android:textSize="20dp" />

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_below="@id/addToWatchlist"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
</RelativeLayout>

Activity XML which is started in Fragment when I click on the button addToWatchlist:

<androidx.constraintlayout.widget.ConstraintLayout
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"
tools:context=".AddToWatchlistActivity"
android:background="@color/darkg">

<TextView
    android:id="@+id/watchlistTitle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:fontFamily="sans-serif"
    android:text="Add new person to you Watchlist"
    android:textAlignment="center"
    android:textColor="@android:color/white"
    android:textSize="18dp"
    app:layout_constraintBottom_toTopOf="@+id/profile_image"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

UPDATE:

I have checked LogCat in more detail and found some lines saying Choreographer(abc): Skipped xx frames! The application may be doing too much work on its main thread. So I went through my code again, I do not have anything that could cause too much work, but I have also checked resources, especially drawables and reduced 2 files (png) to smaller size, from 1MB to about 80KBand that warnings are gone and the color changing behaviour has also changed a little.

When I pressed back button before, and got back into app, dark gray tab + button turned green. Now, when I get back into app right after I press back button, Tab color stays gray, only button in fragment changes to green. When I go out of app and get back again over and over fast enough, it stays that way, but if I wait like 2 seconds and then get back into app, also Tab color changes from gray to green.

This is super odd, I have no clue what is wrong.

Solution

I have solved this problem myself.

I went through TabLayout in XML again, step by step and now it works. I did not analyze what I did different, but this is working XML TabLayout:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 
    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"
    tools:context=".InsideActivity">

<com.google.android.material.appbar.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/transparent">

<ImageView
    android:id="@+id/logo"
    android:layout_width="match_parent"
    android:layout_height="74dp"
    android:contentDescription="Title"
    android:padding="8dp"
    app:srcCompat="@drawable/logo" />

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="65dp"
    android:background="@color/darkg"
    app:tabSelectedTextColor="@android:color/white"
    app:tabTextColor="@android:color/black">

    <com.google.android.material.tabs.TabItem
        android:id="@+id/tabItem"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Watchlist" />

    <com.google.android.material.tabs.TabItem
        android:id="@+id/tabItem2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ExBook" />
</com.google.android.material.tabs.TabLayout>
</com.google.android.material.appbar.AppBarLayout>

<com.fre.book.NonSwipeableViewPager
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

Answered By - mrRobot