I have an application where I allow the user to switch between day and night modes using Theme.AppCompat.DayNight theme. However, randomly when switching themes, the buttons have the wrong background color, and the same thing happens with the overflow button (it will be lighter on a light theme or dark on a dark theme). I wrote a minimal test application and the problem also reproduces here.
Here is an example application:
styles.xml
<resources> <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar"> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style> <style name="AppTheme.Yellow"> <item name="colorAccent">@color/accent_yellow</item> </style> <style name="AppTheme.LightBlue"> <item name="colorAccent">@color/accent_light_blue</item> </style> <style name="AppTheme.Steel"> <item name="colorAccent">@color/accent_steel</item> </style> </resources>
colors.xml
<?xml version="1.0" encoding="utf-8"?> <resources> <color name="colorPrimary">#3F51B5</color> <color name="colorPrimaryDark">#303F9F</color> <color name="colorAccent">#FF4081</color> <color name="accent_light_blue">#ff5677fc</color> <color name="accent_yellow">#ffffc107</color> <color name="accent_steel">#ff607d8b</color> </resources>
arrays.xml
<?xml version="1.0" encoding="utf-8"?> <resources> <array name="accent_colors"> <item>@color/accent_light_blue</item> <item>@color/accent_yellow</item> <item>@color/accent_steel</item> </array> <array name="accent_themes"> <item>@style/AppTheme.LightBlue</item> <item>@style/AppTheme.Yellow</item> <item>@style/AppTheme.Steel</item> </array> </resources>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.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:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.quicosoft.daynighttest.MainActivity" tools:layout_editor_absoluteX="0dp" tools:layout_editor_absoluteY="24dp"> <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Switch theme" tools:layout_editor_absoluteX="143dp" tools:layout_editor_absoluteY="262dp" app:layout_constraintLeft_toLeftOf="@+id/activity_main" tools:layout_constraintLeft_creator="0" app:layout_constraintTop_toTopOf="@+id/activity_main" tools:layout_constraintTop_creator="0" app:layout_constraintRight_toRightOf="@+id/activity_main" tools:layout_constraintRight_creator="0" app:layout_constraintBottom_toBottomOf="@+id/activity_main" tools:layout_constraintBottom_creator="0" app:layout_constraintVertical_bias="0.43" /> <CheckBox android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Checkbox" android:checked="true" tools:layout_editor_absoluteX="159dp" tools:layout_editor_absoluteY="214dp" app:layout_constraintLeft_toLeftOf="@+id/button" tools:layout_constraintLeft_creator="0" app:layout_constraintRight_toRightOf="@+id/button" tools:layout_constraintRight_creator="0" app:layout_constraintBottom_toTopOf="@+id/button" android:layout_marginBottom="16dp" tools:layout_constraintBottom_creator="0" /> </android.support.constraint.ConstraintLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { final SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(this); final boolean night = prefs.getBoolean("mode", false); AppCompatDelegate.setDefaultNightMode(night ? AppCompatDelegate.MODE_NIGHT_YES : AppCompatDelegate.MODE_NIGHT_NO); TypedArray ar = getResources().obtainTypedArray(R.array.accent_themes); int len = ar.length(); int[] themes = new int[len]; for (int i = 0; i < len; themes[i] = ar.getResourceId(i++, 0)) ; ar.recycle(); int colorIndex = new Random().nextInt(len); setTheme(themes[colorIndex]); super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); findViewById(R.id.button).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { prefs.edit().putBoolean("mode", !night).apply(); finish(); startActivity(getIntent()); } }); } }
This is the button when the theme switches correctly:
This is the button when the theme switches incorrectly:
For reference, here is the correct night theme (the problem occurs in both day and night modes, the theme of the day will have a button with a dark gray background instead of light gray, and the night theme will have a light gray background instead of dark gray - this how the button saves the background from the previous topic, but the text inside switches to the correct theme):
Any ideas why the button sometimes has the wrong background?