Merge pull request #786 from Kethen/colors

old color themes, ucrop color, edit button icon color by theme, ucrop toolbar font
2026-04-30 04:03:13 -04:00 · 2022-02-06 11:49:35 +01:00
parent 1646db24df 0552acae26
commit 7dd2291376
15 changed files with 655 additions and 54 deletions
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -116,7 +116,7 @@
        </activity>

        <activity
-            android:name="com.yalantis.ucrop.UCropActivity"
+            android:name=".UCropWrapper"
            android:theme="@style/AppTheme.NoActionBar" />

        <provider
--- a/app/src/main/java/protect/card_locker/CatimaAppCompatActivity.java
+++ b/app/src/main/java/protect/card_locker/CatimaAppCompatActivity.java
@@ -19,10 +19,9 @@ public class CatimaAppCompatActivity extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
-        // XXX on the splash screen activity, aka the main activity, this has to be executed after applying dynamic colors, not before
-        // so running this only on non main for now
+        // XXX splash screen activity has to do this after installing splash screen before view inflate
        if (!this.getClass().getSimpleName().equals(MainActivity.class.getSimpleName())) {
-            Utils.patchOledDarkTheme(this);
+            Utils.patchColors(this);
        }
    }

@@ -31,17 +30,15 @@ public class CatimaAppCompatActivity extends AppCompatActivity {
        super.onPostCreate(savedInstanceState);
        // material 3 designer does not consider status bar colors
        // XXX changing this in onCreate causes issues with the splash screen activity, so doing this here
+        boolean darkMode = Utils.isDarkModeEnabled(this);
        if (Build.VERSION.SDK_INT >= 23) {
            getWindow().setStatusBarColor(Color.TRANSPARENT);
-            getWindow().getDecorView().setSystemUiVisibility(Utils.isDarkModeEnabled(this) ? 0 : View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
+            getWindow().getDecorView().setSystemUiVisibility(darkMode ? 0 : View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
        } else {
            // icons are always white back then
-            getWindow().setStatusBarColor(Utils.isDarkModeEnabled(this) ? Color.TRANSPARENT : Color.argb(127, 0, 0, 0));
+            getWindow().setStatusBarColor(darkMode ? Color.TRANSPARENT : Color.argb(127, 0, 0, 0));
        }
        // XXX android 9 and below has a nasty rendering bug if the theme was patched earlier
-        // the splash screen activity needs the fix regardless to solve a dynamic color api issue
-        if (!this.getClass().getSimpleName().equals(MainActivity.class.getSimpleName())) {
-            Utils.postPatchOledDarkTheme(this);
-        }
+        Utils.postPatchColors(this);
    }
 }
--- a/app/src/main/java/protect/card_locker/LoyaltyCardEditActivity.java
+++ b/app/src/main/java/protect/card_locker/LoyaltyCardEditActivity.java
@@ -69,6 +69,7 @@ import androidx.activity.result.contract.ActivityResultContracts;
 import androidx.annotation.NonNull;
 import androidx.appcompat.app.ActionBar;
 import androidx.appcompat.app.AlertDialog;
+import androidx.appcompat.widget.AppCompatTextView;
 import androidx.appcompat.widget.Toolbar;
 import androidx.core.content.ContextCompat;
 import androidx.core.content.FileProvider;
@@ -135,6 +136,8 @@ public class LoyaltyCardEditActivity extends CatimaAppCompatActivity {

    Button enterButton;

+    Toolbar toolbar;
+
    int loyaltyCardId;
    boolean updateLoyaltyCard;
    String cardId;
@@ -291,7 +294,7 @@ public class LoyaltyCardEditActivity extends CatimaAppCompatActivity {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.loyalty_card_edit_activity);
-        Toolbar toolbar = findViewById(R.id.toolbar);
+        toolbar = findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        ActionBar actionBar = getSupportActionBar();
        if (actionBar != null) {
@@ -690,9 +693,22 @@ public class LoyaltyCardEditActivity extends CatimaAppCompatActivity {
        );

        // Fix theming
+
        int colorPrimary = MaterialColors.getColor(this, R.attr.colorPrimary, ContextCompat.getColor(this, R.color.md_theme_light_primary));
-        mCropperOptions.setToolbarColor(colorPrimary);
-        mCropperOptions.setStatusBarColor(colorPrimary);
+        int colorOnPrimary = MaterialColors.getColor(this, R.attr.colorOnPrimary, ContextCompat.getColor(this, R.color.md_theme_light_onPrimary));
+        int colorSurface = MaterialColors.getColor(this, R.attr.colorSurface, ContextCompat.getColor(this, R.color.md_theme_light_surface));
+        int colorOnSurface = MaterialColors.getColor(this, R.attr.colorOnSurface, ContextCompat.getColor(this, R.color.md_theme_light_onSurface));
+        int colorBackground = MaterialColors.getColor(this, android.R.attr.colorBackground, ContextCompat.getColor(this, R.color.md_theme_light_onSurface));
+        mCropperOptions.setToolbarColor(colorSurface);
+        mCropperOptions.setStatusBarColor(colorSurface);
+        mCropperOptions.setToolbarWidgetColor(colorOnSurface);
+        mCropperOptions.setRootViewBackgroundColor(colorBackground);
+        // set tool tip to be the darker of primary color
+        if (Utils.isDarkModeEnabled(this)) {
+            mCropperOptions.setActiveControlsWidgetColor(colorOnPrimary);
+        } else {
+            mCropperOptions.setActiveControlsWidgetColor(colorPrimary);
+        }
    }

    @Override
@@ -906,7 +922,7 @@ public class LoyaltyCardEditActivity extends CatimaAppCompatActivity {
    protected void setColorFromIcon() {
        Object icon = thumbnail.getTag();
        if (icon != null && (icon instanceof Bitmap)) {
-            updateTempState(LoyaltyCardField.headerColor, new Palette.Builder((Bitmap) icon).generate().getDominantColor(tempLoyaltyCard.headerColor != null ? tempLoyaltyCard.headerColor :  R.attr.colorPrimary));
+            updateTempState(LoyaltyCardField.headerColor, new Palette.Builder((Bitmap) icon).generate().getDominantColor(tempLoyaltyCard.headerColor != null ? tempLoyaltyCard.headerColor : R.attr.colorPrimary));
        } else {
            Log.d("setColorFromIcon", "attempting header color change from icon but icon does not exist");
        }
@@ -1391,13 +1407,22 @@ public class LoyaltyCardEditActivity extends CatimaAppCompatActivity {
                }
            }
        }
-        mCropperLauncher.launch(
-                UCrop.of(
-                        sourceUri,
-                        destUri
-                ).withOptions(mCropperOptions)
-                        .getIntent(this)
-        );
+        Intent ucropIntent = UCrop.of(
+                sourceUri,
+                destUri
+        ).withOptions(mCropperOptions)
+                .getIntent(this);
+        ucropIntent.setClass(this, UCropWrapper.class);
+        for (int i = 0; i < toolbar.getChildCount(); i++) {
+            // send toolbar font details to ucrop wrapper
+            View child = toolbar.getChildAt(i);
+            if (child instanceof AppCompatTextView) {
+                AppCompatTextView childTextView = (AppCompatTextView) child;
+                ucropIntent.putExtra(UCropWrapper.UCROP_TOOLBAR_TYPEFACE_STYLE, childTextView.getTypeface().getStyle());
+                break;
+            }
+        }
+        mCropperLauncher.launch(ucropIntent);
    }

    private void generateBarcode() {
--- a/app/src/main/java/protect/card_locker/LoyaltyCardLockerApplication.java
+++ b/app/src/main/java/protect/card_locker/LoyaltyCardLockerApplication.java
@@ -16,6 +16,5 @@ public class LoyaltyCardLockerApplication extends Application {

        Settings settings = new Settings(this);
        AppCompatDelegate.setDefaultNightMode(settings.getTheme());
-        DynamicColors.applyToActivitiesIfAvailable(this);
    }
 }
--- a/app/src/main/java/protect/card_locker/LoyaltyCardViewActivity.java
+++ b/app/src/main/java/protect/card_locker/LoyaltyCardViewActivity.java
@@ -33,6 +33,7 @@ import android.widget.Toast;

 import com.google.android.material.appbar.AppBarLayout;
 import com.google.android.material.bottomsheet.BottomSheetBehavior;
+import com.google.android.material.color.MaterialColors;
 import com.google.android.material.floatingactionbutton.FloatingActionButton;

 import java.io.UnsupportedEncodingException;
@@ -580,10 +581,13 @@ public class LoyaltyCardViewActivity extends CatimaAppCompatActivity implements
        editButton.setBackgroundTintList(ColorStateList.valueOf(complementaryColor));
        Drawable editButtonIcon = editButton.getDrawable();
        editButtonIcon.mutate();
+        int colorPrimary = MaterialColors.getColor(this, R.attr.colorPrimary, ContextCompat.getColor(this, R.color.md_theme_light_primary));
+        int colorOnPrimary = MaterialColors.getColor(this, R.attr.colorOnPrimary, ContextCompat.getColor(this, R.color.md_theme_light_onPrimary));
+        boolean darkMode = Utils.isDarkModeEnabled(this);
        if (Utils.needsDarkForeground(complementaryColor)) {
-            editButtonIcon.setTint(ContextCompat.getColor(this, R.color.md_theme_light_onBackground));
+            editButtonIcon.setTint(darkMode ? colorOnPrimary : colorPrimary);
        } else {
-            editButtonIcon.setTint(ContextCompat.getColor(this, R.color.md_theme_dark_onBackground));
+            editButtonIcon.setTint(darkMode ? colorPrimary : colorOnPrimary);
        }
        editButton.setImageDrawable(editButtonIcon);

@@ -647,7 +651,6 @@ public class LoyaltyCardViewActivity extends CatimaAppCompatActivity implements
        dotIndicator.removeAllViews();
        if (imageTypes.size() >= 2) {
            dots = new ImageView[imageTypes.size()];
-            boolean darkMode = Utils.isDarkModeEnabled(getApplicationContext());

            for (int i = 0; i < imageTypes.size(); i++) {
                dots[i] = new ImageView(this);
--- a/app/src/main/java/protect/card_locker/MainActivity.java
+++ b/app/src/main/java/protect/card_locker/MainActivity.java
@@ -180,20 +180,10 @@ public class MainActivity extends CatimaAppCompatActivity implements LoyaltyCard
    protected void onCreate(Bundle inputSavedInstanceState) {
        super.onCreate(inputSavedInstanceState);
        SplashScreen.installSplashScreen(this);
-
-        // onPreCreate can't tell this activity uses a material theme due to splash screen, force color application here
-        DynamicColors.applyIfAvailable(this);
-        Utils.patchOledDarkTheme(this);
        setTitle(R.string.app_name);
-
+        // XXX color patching has to be done again after setting splash screen
+        Utils.patchColors(this);
        setContentView(R.layout.main_activity);
-
-        // XXX more dynamic color fixing due to splash screen
-        // without this the background color will get stuck with the old color before dynamic color
-        TypedValue typedValue = new TypedValue();
-        getTheme().resolveAttribute(android.R.attr.colorBackground, typedValue, true);
-        findViewById(android.R.id.content).setBackgroundColor(typedValue.data);
-
        Toolbar toolbar = findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

--- a/app/src/main/java/protect/card_locker/UCropWrapper.java
+++ b/app/src/main/java/protect/card_locker/UCropWrapper.java
@@ -0,0 +1,79 @@
+package protect.card_locker;
+
+import android.content.Intent;
+import android.graphics.Color;
+import android.graphics.Typeface;
+import android.graphics.drawable.Drawable;
+import android.os.Build;
+import android.os.Bundle;
+import android.view.View;
+import android.widget.FrameLayout;
+import android.widget.LinearLayout;
+
+import androidx.annotation.Nullable;
+import androidx.appcompat.widget.AppCompatImageView;
+import androidx.core.content.ContextCompat;
+import androidx.core.graphics.ColorUtils;
+
+import com.google.android.material.color.MaterialColors;
+import com.google.android.material.textview.MaterialTextView;
+import com.yalantis.ucrop.UCropActivity;
+
+public class UCropWrapper extends UCropActivity {
+    public static final String UCROP_TOOLBAR_TYPEFACE_STYLE = "ucop_toolbar_typeface_style";
+
+    @Override
+    protected void onPostCreate(@Nullable Bundle savedInstanceState) {
+        super.onPostCreate(savedInstanceState);
+        boolean darkMode = Utils.isDarkModeEnabled(this);
+        // setup status bar to look like the rest of the app
+        if (Build.VERSION.SDK_INT >= 23) {
+            getWindow().getDecorView().setSystemUiVisibility(darkMode ? 0 : View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
+        } else {
+            // icons are always white back then
+            if (!darkMode) {
+                getWindow().setStatusBarColor(ColorUtils.compositeColors(Color.argb(127, 0, 0, 0), getWindow().getStatusBarColor()));
+            }
+        }
+
+        // find and check views that we wish to color modify
+        // for when we update ucrop or switch to another cropper
+        View check = findViewById(com.yalantis.ucrop.R.id.wrapper_controls);
+        if (check instanceof FrameLayout) {
+            FrameLayout controls = (FrameLayout) check;
+            check = findViewById(com.yalantis.ucrop.R.id.wrapper_states);
+            if (check instanceof LinearLayout) {
+                LinearLayout states = (LinearLayout) check;
+                for (int i = 0; i < controls.getChildCount(); i++) {
+                    check = controls.getChildAt(i);
+                    if (check instanceof AppCompatImageView) {
+                        AppCompatImageView controlsBackgroundImage = (AppCompatImageView) check;
+                        // everything gathered and are as expected, now perform color patching
+                        Utils.patchColors(this);
+                        int colorSurface = MaterialColors.getColor(this, R.attr.colorSurface, ContextCompat.getColor(this, R.color.md_theme_light_surface));
+                        int colorOnSurface = MaterialColors.getColor(this, R.attr.colorOnSurface, ContextCompat.getColor(this, R.color.md_theme_light_onSurface));
+
+                        Drawable controlsBackgroundImageDrawable = controlsBackgroundImage.getBackground();
+                        controlsBackgroundImageDrawable.mutate();
+                        controlsBackgroundImageDrawable.setTint(darkMode ? colorOnSurface : colorSurface);
+                        controlsBackgroundImage.setBackgroundDrawable(controlsBackgroundImageDrawable);
+
+                        states.setBackgroundColor(darkMode ? colorSurface : colorOnSurface);
+                        break;
+                    }
+                }
+            }
+        }
+
+        // change toolbar font
+        check = findViewById(com.yalantis.ucrop.R.id.toolbar_title);
+        if (check instanceof MaterialTextView) {
+            MaterialTextView toolbarTextview = (MaterialTextView) check;
+            Intent intent = getIntent();
+            int style = intent.getIntExtra(UCROP_TOOLBAR_TYPEFACE_STYLE, -1);
+            if (style != -1) {
+                toolbarTextview.setTypeface(Typeface.defaultFromStyle(style));
+            }
+        }
+    }
+}
--- a/app/src/main/java/protect/card_locker/Utils.java
+++ b/app/src/main/java/protect/card_locker/Utils.java
@@ -17,6 +17,7 @@ import android.util.Log;
 import android.util.TypedValue;
 import android.widget.Toast;

+import com.google.android.material.color.DynamicColors;
 import com.google.zxing.BinaryBitmap;
 import com.google.zxing.LuminanceSource;
 import com.google.zxing.MultiFormatReader;
@@ -464,21 +465,45 @@ public class Utils {
    }

    // replace colors in the current theme
-    // use before views are inflated, after dynamic color
-    public static void patchOledDarkTheme(AppCompatActivity activity) {
-        if (isDarkModeEnabled(activity) && new Settings(activity).getOledDark()) {
-            activity.getTheme().applyStyle(R.style.DarkBackground, true);
+    public static void patchColors(AppCompatActivity activity) {
+        Settings settings = new Settings(activity);
+        String color = settings.getColor();
+
+        Resources.Theme theme = activity.getTheme();
+        Resources resources = activity.getResources();
+        if (color.equals(resources.getString(R.string.settings_key_pink_theme))) {
+            theme.applyStyle(R.style.pink, true);
+        } else if (color.equals(resources.getString(R.string.settings_key_magenta_theme))) {
+            theme.applyStyle(R.style.magenta, true);
+        } else if (color.equals(resources.getString(R.string.settings_key_violet_theme))) {
+            theme.applyStyle(R.style.violet, true);
+        } else if (color.equals(resources.getString(R.string.settings_key_blue_theme))) {
+            theme.applyStyle(R.style.blue, true);
+        } else if (color.equals(resources.getString(R.string.settings_key_sky_blue_theme))) {
+            theme.applyStyle(R.style.skyblue, true);
+        } else if (color.equals(resources.getString(R.string.settings_key_green_theme))) {
+            theme.applyStyle(R.style.green, true);
+        } else if (color.equals(resources.getString(R.string.settings_key_brown_theme))) {
+            theme.applyStyle(R.style.brown, true);
+        } else if (color.equals(resources.getString(R.string.settings_key_catima_theme))) {
+            // catima theme is AppTheme itself, no dynamic colors nor applyStyle
+        } else {
+            // final catch all in case of invalid theme value from older versions
+            // also handles R.string.settings_key_system_theme
+            DynamicColors.applyIfAvailable(activity);
+        }
+
+        if (isDarkModeEnabled(activity) && settings.getOledDark()) {
+            theme.applyStyle(R.style.DarkBackground, true);
        }
    }

    // XXX android 9 and below has issues with patched theme where the background becomes a
    // rendering mess
    // use after views are inflated
-    public static void postPatchOledDarkTheme(AppCompatActivity activity) {
-        if (isDarkModeEnabled(activity) && new Settings(activity).getOledDark()) {
-            TypedValue typedValue = new TypedValue();
-            activity.getTheme().resolveAttribute(android.R.attr.colorBackground, typedValue, true);
-            activity.findViewById(android.R.id.content).setBackgroundColor(typedValue.data);
-        }
+    public static void postPatchColors(AppCompatActivity activity) {
+        TypedValue typedValue = new TypedValue();
+        activity.getTheme().resolveAttribute(android.R.attr.colorBackground, typedValue, true);
+        activity.findViewById(android.R.id.content).setBackgroundColor(typedValue.data);
    }
 }
--- a/app/src/main/java/protect/card_locker/preferences/Settings.java
+++ b/app/src/main/java/protect/card_locker/preferences/Settings.java
@@ -107,4 +107,8 @@ public class Settings {
    public boolean getOledDark() {
        return getBoolean(R.string.settings_key_oled_dark, false);
    }
+
+    public String getColor() {
+        return getString(R.string.setting_key_theme_color, mContext.getResources().getString(R.string.settings_key_system_theme));
+    }
 }
--- a/app/src/main/java/protect/card_locker/preferences/SettingsActivity.java
+++ b/app/src/main/java/protect/card_locker/preferences/SettingsActivity.java
@@ -19,6 +19,8 @@ import androidx.preference.ListPreference;
 import androidx.preference.Preference;
 import androidx.preference.PreferenceFragmentCompat;

+import com.google.android.material.color.DynamicColors;
+
 import nl.invissvenska.numberpickerpreference.NumberDialogPreference;
 import nl.invissvenska.numberpickerpreference.NumberPickerPreferenceDialogFragment;
 import protect.card_locker.CatimaAppCompatActivity;
@@ -140,6 +142,17 @@ public class SettingsActivity extends CatimaAppCompatActivity {
                refreshActivity(true);
                return true;
            });
+
+            ListPreference colorPreference = findPreference(getResources().getString(R.string.setting_key_theme_color));
+            assert colorPreference != null;
+            colorPreference.setOnPreferenceChangeListener((preference, o) -> {
+                refreshActivity(true);
+                return true;
+            });
+            if (!DynamicColors.isDynamicColorAvailable()) {
+                colorPreference.setEntryValues(R.array.color_values_no_dynamic);
+                colorPreference.setEntries(R.array.color_value_strings_no_dynamic);
+            }
        }

        private void refreshActivity(boolean reloadMain) {
--- a/app/src/main/res/layout/settings_activity.xml
+++ b/app/src/main/res/layout/settings_activity.xml
@@ -1,9 +1,11 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<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"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
-    android:orientation="vertical">
+    android:fitsSystemWindows="true"
+    tools:context="protect.card_locker.preferences.SettingsActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
@@ -11,15 +13,16 @@

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/toolbar"
+            style="?attr/toolbarStyle"
            android:layout_width="match_parent"
-            android:layout_height="?attr/actionBarSize"
-            style="?attr/toolbarStyle" />
+            android:layout_height="?attr/actionBarSize" />

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

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/settings_container"
        android:layout_width="match_parent"
-        android:layout_height="match_parent" />
+        android:layout_height="match_parent"
+        android:layout_marginTop="?attr/actionBarSize" />

-</LinearLayout>
+</androidx.coordinatorlayout.widget.CoordinatorLayout>
--- a/app/src/main/res/values-night/themes.xml
+++ b/app/src/main/res/values-night/themes.xml
@@ -38,4 +38,208 @@
        <item name="android:colorBackground">#000000</item>
        <item name="colorSurface">#000000</item>
    </style>
+
+    <!-- color themes -->
+    <style name="pink">
+        <item name="colorPrimary">#FFB2C0</item>
+        <item name="colorOnPrimary">#670024</item>
+        <item name="colorPrimaryContainer">#900036</item>
+        <item name="colorOnPrimaryContainer">#FFD9DF</item>
+        <item name="colorSecondary">#E5BDC2</item>
+        <item name="colorOnSecondary">#43292D</item>
+        <item name="colorSecondaryContainer">#5C3F43</item>
+        <item name="colorOnSecondaryContainer">#FFD9DE</item>
+        <item name="colorTertiary">#EBBF90</item>
+        <item name="colorOnTertiary">#452B08</item>
+        <item name="colorTertiaryContainer">#5F411C</item>
+        <item name="colorOnTertiaryContainer">#FFDDB8</item>
+        <item name="colorError">#FFB4A9</item>
+        <item name="colorErrorContainer">#930006</item>
+        <item name="colorOnError">#680003</item>
+        <item name="colorOnErrorContainer">#FFDAD4</item>
+        <item name="android:colorBackground">#201A1B</item>
+        <item name="colorOnBackground">#ECE0E0</item>
+        <item name="colorSurface">#201A1B</item>
+        <item name="colorOnSurface">#ECE0E0</item>
+        <item name="colorSurfaceVariant">#524345</item>
+        <item name="colorOnSurfaceVariant">#D6C1C3</item>
+        <item name="colorOutline">#9F8C8E</item>
+        <item name="colorOnSurfaceInverse">#201A1B</item>
+        <item name="colorSurfaceInverse">#ECE0E0</item>
+        <item name="colorPrimaryInverse">#BC0049</item>
+    </style>
+
+    <style name="magenta">
+        <item name="colorPrimary">#FBAAFF</item>
+        <item name="colorOnPrimary">#570068</item>
+        <item name="colorPrimaryContainer">#7B0091</item>
+        <item name="colorOnPrimaryContainer">#FFD5FF</item>
+        <item name="colorSecondary">#D7BFD5</item>
+        <item name="colorOnSecondary">#3B2B3B</item>
+        <item name="colorSecondaryContainer">#534153</item>
+        <item name="colorOnSecondaryContainer">#F5DBF2</item>
+        <item name="colorTertiary">#F6B8AE</item>
+        <item name="colorOnTertiary">#4C251F</item>
+        <item name="colorTertiaryContainer">#663B34</item>
+        <item name="colorOnTertiaryContainer">#FFDAD2</item>
+        <item name="colorError">#FFB4A9</item>
+        <item name="colorErrorContainer">#930006</item>
+        <item name="colorOnError">#680003</item>
+        <item name="colorOnErrorContainer">#FFDAD4</item>
+        <item name="android:colorBackground">#1E1A1D</item>
+        <item name="colorOnBackground">#E9E0E5</item>
+        <item name="colorSurface">#1E1A1D</item>
+        <item name="colorOnSurface">#E9E0E5</item>
+        <item name="colorSurfaceVariant">#4D444C</item>
+        <item name="colorOnSurfaceVariant">#D0C3CC</item>
+        <item name="colorOutline">#998E96</item>
+        <item name="colorOnSurfaceInverse">#1E1A1D</item>
+        <item name="colorSurfaceInverse">#E9E0E5</item>
+        <item name="colorPrimaryInverse">#9A25AE</item>
+    </style>
+
+    <style name="violet">
+        <item name="colorPrimary">#D4BAFF</item>
+        <item name="colorOnPrimary">#3E008E</item>
+        <item name="colorPrimaryContainer">#5727A7</item>
+        <item name="colorOnPrimaryContainer">#ECDCFF</item>
+        <item name="colorSecondary">#CDC2DB</item>
+        <item name="colorOnSecondary">#342D41</item>
+        <item name="colorSecondaryContainer">#4B4358</item>
+        <item name="colorOnSecondaryContainer">#E9DEF7</item>
+        <item name="colorTertiary">#F0B8C5</item>
+        <item name="colorOnTertiary">#4A2530</item>
+        <item name="colorTertiaryContainer">#643A46</item>
+        <item name="colorOnTertiaryContainer">#FFD9E2</item>
+        <item name="colorError">#FFB4A9</item>
+        <item name="colorErrorContainer">#930006</item>
+        <item name="colorOnError">#680003</item>
+        <item name="colorOnErrorContainer">#FFDAD4</item>
+        <item name="android:colorBackground">#1D1B1F</item>
+        <item name="colorOnBackground">#E6E1E5</item>
+        <item name="colorSurface">#1D1B1F</item>
+        <item name="colorOnSurface">#E6E1E5</item>
+        <item name="colorSurfaceVariant">#49454E</item>
+        <item name="colorOnSurfaceVariant">#CBC4CF</item>
+        <item name="colorOutline">#948E99</item>
+        <item name="colorOnSurfaceInverse">#1D1B1F</item>
+        <item name="colorSurfaceInverse">#E6E1E5</item>
+        <item name="colorPrimaryInverse">#6F43BF</item>
+    </style>
+
+    <style name="blue">
+        <item name="colorPrimary">#B9C3FF</item>
+        <item name="colorOnPrimary">#08218A</item>
+        <item name="colorPrimaryContainer">#293CA0</item>
+        <item name="colorOnPrimaryContainer">#DDE0FF</item>
+        <item name="colorSecondary">#C4C5DD</item>
+        <item name="colorOnSecondary">#2D2F42</item>
+        <item name="colorSecondaryContainer">#43465A</item>
+        <item name="colorOnSecondaryContainer">#E0E1FA</item>
+        <item name="colorTertiary">#E5BAD7</item>
+        <item name="colorOnTertiary">#45263E</item>
+        <item name="colorTertiaryContainer">#5D3C55</item>
+        <item name="colorOnTertiaryContainer">#FFD7F3</item>
+        <item name="colorError">#FFB4A9</item>
+        <item name="colorErrorContainer">#930006</item>
+        <item name="colorOnError">#680003</item>
+        <item name="colorOnErrorContainer">#FFDAD4</item>
+        <item name="android:colorBackground">#1B1B1F</item>
+        <item name="colorOnBackground">#E4E1E6</item>
+        <item name="colorSurface">#1B1B1F</item>
+        <item name="colorOnSurface">#E4E1E6</item>
+        <item name="colorSurfaceVariant">#46464F</item>
+        <item name="colorOnSurfaceVariant">#C6C5D0</item>
+        <item name="colorOutline">#90909A</item>
+        <item name="colorOnSurfaceInverse">#1B1B1F</item>
+        <item name="colorSurfaceInverse">#E4E1E6</item>
+        <item name="colorPrimaryInverse">#4355B9</item>
+    </style>
+
+    <style name="skyblue">
+        <item name="colorPrimary">#8BCEFF</item>
+        <item name="colorOnPrimary">#003450</item>
+        <item name="colorPrimaryContainer">#004B71</item>
+        <item name="colorOnPrimaryContainer">#C8E6FF</item>
+        <item name="colorSecondary">#B7C8D8</item>
+        <item name="colorOnSecondary">#22323F</item>
+        <item name="colorSecondaryContainer">#384956</item>
+        <item name="colorOnSecondaryContainer">#D3E4F5</item>
+        <item name="colorTertiary">#CFBFE8</item>
+        <item name="colorOnTertiary">#362B4B</item>
+        <item name="colorTertiaryContainer">#4D4162</item>
+        <item name="colorOnTertiaryContainer">#ECDCFF</item>
+        <item name="colorError">#FFB4A9</item>
+        <item name="colorErrorContainer">#930006</item>
+        <item name="colorOnError">#680003</item>
+        <item name="colorOnErrorContainer">#FFDAD4</item>
+        <item name="android:colorBackground">#1A1C1E</item>
+        <item name="colorOnBackground">#E2E2E5</item>
+        <item name="colorSurface">#1A1C1E</item>
+        <item name="colorOnSurface">#E2E2E5</item>
+        <item name="colorSurfaceVariant">#41474D</item>
+        <item name="colorOnSurfaceVariant">#C1C7CE</item>
+        <item name="colorOutline">#8B9198</item>
+        <item name="colorOnSurfaceInverse">#1A1C1E</item>
+        <item name="colorSurfaceInverse">#E2E2E5</item>
+        <item name="colorPrimaryInverse">#006494</item>
+    </style>
+
+    <style name="green">
+        <item name="colorPrimary">#78DC77</item>
+        <item name="colorOnPrimary">#003907</item>
+        <item name="colorPrimaryContainer">#00530F</item>
+        <item name="colorOnPrimaryContainer">#93F990</item>
+        <item name="colorSecondary">#B9CCB3</item>
+        <item name="colorOnSecondary">#253423</item>
+        <item name="colorSecondaryContainer">#3B4B38</item>
+        <item name="colorOnSecondaryContainer">#D5E8CE</item>
+        <item name="colorTertiary">#A1CFD5</item>
+        <item name="colorOnTertiary">#00363B</item>
+        <item name="colorTertiaryContainer">#1E4D52</item>
+        <item name="colorOnTertiaryContainer">#BCEBF0</item>
+        <item name="colorError">#FFB4A9</item>
+        <item name="colorErrorContainer">#930006</item>
+        <item name="colorOnError">#680003</item>
+        <item name="colorOnErrorContainer">#FFDAD4</item>
+        <item name="android:colorBackground">#1A1C19</item>
+        <item name="colorOnBackground">#E2E3DD</item>
+        <item name="colorSurface">#1A1C19</item>
+        <item name="colorOnSurface">#E2E3DD</item>
+        <item name="colorSurfaceVariant">#424840</item>
+        <item name="colorOnSurfaceVariant">#C2C8BD</item>
+        <item name="colorOutline">#8C9288</item>
+        <item name="colorOnSurfaceInverse">#1A1C19</item>
+        <item name="colorSurfaceInverse">#E2E3DD</item>
+        <item name="colorPrimaryInverse">#006E17</item>
+    </style>
+
+    <style name="brown">
+        <item name="colorPrimary">#FFB598</item>
+        <item name="colorOnPrimary">#5C1A00</item>
+        <item name="colorPrimaryContainer">#7B2E0D</item>
+        <item name="colorOnPrimaryContainer">#FFDBCD</item>
+        <item name="colorSecondary">#E7BEB0</item>
+        <item name="colorOnSecondary">#442A20</item>
+        <item name="colorSecondaryContainer">#5D4035</item>
+        <item name="colorOnSecondaryContainer">#FFDBCD</item>
+        <item name="colorTertiary">#D5C78E</item>
+        <item name="colorOnTertiary">#383005</item>
+        <item name="colorTertiaryContainer">#50461A</item>
+        <item name="colorOnTertiaryContainer">#F1E2A7</item>
+        <item name="colorError">#FFB4A9</item>
+        <item name="colorErrorContainer">#930006</item>
+        <item name="colorOnError">#680003</item>
+        <item name="colorOnErrorContainer">#FFDAD4</item>
+        <item name="android:colorBackground">#201A18</item>
+        <item name="colorOnBackground">#EDE0DC</item>
+        <item name="colorSurface">#201A18</item>
+        <item name="colorOnSurface">#EDE0DC</item>
+        <item name="colorSurfaceVariant">#52433E</item>
+        <item name="colorOnSurfaceVariant">#D8C2BB</item>
+        <item name="colorOutline">#A08C86</item>
+        <item name="colorOnSurfaceInverse">#201A18</item>
+        <item name="colorSurfaceInverse">#EDE0DC</item>
+        <item name="colorPrimaryInverse">#9A4523</item>
+    </style>
 </resources>
--- a/app/src/main/res/values/settings.xml
+++ b/app/src/main/res/values/settings.xml
@@ -12,6 +12,52 @@
        <item>@string/settings_dark_theme</item>
    </string-array>

+    <string-array name="color_values">
+        <item>@string/settings_key_system_theme</item>
+        <item>@string/settings_key_catima_theme</item>
+        <item>@string/settings_key_pink_theme</item>
+        <item>@string/settings_key_magenta_theme</item>
+        <item>@string/settings_key_violet_theme</item>
+        <item>@string/settings_key_blue_theme</item>
+        <item>@string/settings_key_sky_blue_theme</item>
+        <item>@string/settings_key_green_theme</item>
+        <item>@string/settings_key_brown_theme</item>
+    </string-array>
+
+    <string-array name="color_value_strings">
+        <item>@string/settings_system_theme</item>
+        <item>@string/settings_catima_theme</item>
+        <item>@string/settings_pink_theme</item>
+        <item>@string/settings_magenta_theme</item>
+        <item>@string/settings_violet_theme</item>
+        <item>@string/settings_blue_theme</item>
+        <item>@string/settings_sky_blue_theme</item>
+        <item>@string/settings_green_theme</item>
+        <item>@string/settings_brown_theme</item>
+    </string-array>
+
+    <string-array name="color_values_no_dynamic">
+        <item>@string/settings_key_system_theme</item>
+        <item>@string/settings_key_pink_theme</item>
+        <item>@string/settings_key_magenta_theme</item>
+        <item>@string/settings_key_violet_theme</item>
+        <item>@string/settings_key_blue_theme</item>
+        <item>@string/settings_key_sky_blue_theme</item>
+        <item>@string/settings_key_green_theme</item>
+        <item>@string/settings_key_brown_theme</item>
+    </string-array>
+
+    <string-array name="color_value_strings_no_dynamic">
+        <item>@string/settings_catima_theme</item>
+        <item>@string/settings_pink_theme</item>
+        <item>@string/settings_magenta_theme</item>
+        <item>@string/settings_violet_theme</item>
+        <item>@string/settings_blue_theme</item>
+        <item>@string/settings_sky_blue_theme</item>
+        <item>@string/settings_green_theme</item>
+        <item>@string/settings_brown_theme</item>
+    </string-array>
+
    <string-array name="locale_values">
        <item />
        <item>bg</item>
--- a/app/src/main/res/values/themes.xml
+++ b/app/src/main/res/values/themes.xml
@@ -52,4 +52,208 @@

    <!-- place holder for dark background night theme overrides -->
    <style name="DarkBackground" />
+
+    <!-- color themes -->
+    <style name="pink">
+        <item name="colorPrimary">#BC0049</item>
+        <item name="colorOnPrimary">#FFFFFF</item>
+        <item name="colorPrimaryContainer">#FFD9DF</item>
+        <item name="colorOnPrimaryContainer">#400013</item>
+        <item name="colorSecondary">#76565B</item>
+        <item name="colorOnSecondary">#FFFFFF</item>
+        <item name="colorSecondaryContainer">#FFD9DE</item>
+        <item name="colorOnSecondaryContainer">#2B1519</item>
+        <item name="colorTertiary">#795831</item>
+        <item name="colorOnTertiary">#FFFFFF</item>
+        <item name="colorTertiaryContainer">#FFDDB8</item>
+        <item name="colorOnTertiaryContainer">#2C1700</item>
+        <item name="colorError">#BA1B1B</item>
+        <item name="colorErrorContainer">#FFDAD4</item>
+        <item name="colorOnError">#FFFFFF</item>
+        <item name="colorOnErrorContainer">#410001</item>
+        <item name="android:colorBackground">#FCFCFC</item>
+        <item name="colorOnBackground">#201A1B</item>
+        <item name="colorSurface">#FCFCFC</item>
+        <item name="colorOnSurface">#201A1B</item>
+        <item name="colorSurfaceVariant">#F4DDDF</item>
+        <item name="colorOnSurfaceVariant">#524345</item>
+        <item name="colorOutline">#847375</item>
+        <item name="colorOnSurfaceInverse">#FAEEEE</item>
+        <item name="colorSurfaceInverse">#362F30</item>
+        <item name="colorPrimaryInverse">#FFB2C0</item>
+    </style>
+
+    <style name="magenta">
+        <item name="colorPrimary">#9A25AE</item>
+        <item name="colorOnPrimary">#FFFFFF</item>
+        <item name="colorPrimaryContainer">#FFD5FF</item>
+        <item name="colorOnPrimaryContainer">#350040</item>
+        <item name="colorSecondary">#6B586B</item>
+        <item name="colorOnSecondary">#FFFFFF</item>
+        <item name="colorSecondaryContainer">#F5DBF2</item>
+        <item name="colorOnSecondaryContainer">#251626</item>
+        <item name="colorTertiary">#82524A</item>
+        <item name="colorOnTertiary">#FFFFFF</item>
+        <item name="colorTertiaryContainer">#FFDAD2</item>
+        <item name="colorOnTertiaryContainer">#32110C</item>
+        <item name="colorError">#BA1B1B</item>
+        <item name="colorErrorContainer">#FFDAD4</item>
+        <item name="colorOnError">#FFFFFF</item>
+        <item name="colorOnErrorContainer">#410001</item>
+        <item name="android:colorBackground">#FCFCFC</item>
+        <item name="colorOnBackground">#1E1A1D</item>
+        <item name="colorSurface">#FCFCFC</item>
+        <item name="colorOnSurface">#1E1A1D</item>
+        <item name="colorSurfaceVariant">#ECDEE8</item>
+        <item name="colorOnSurfaceVariant">#4D444C</item>
+        <item name="colorOutline">#7E747C</item>
+        <item name="colorOnSurfaceInverse">#F7EEF3</item>
+        <item name="colorSurfaceInverse">#332F32</item>
+        <item name="colorPrimaryInverse">#FBAAFF</item>
+    </style>
+
+    <style name="violet">
+        <item name="colorPrimary">#6F43BF</item>
+        <item name="colorOnPrimary">#FFFFFF</item>
+        <item name="colorPrimaryContainer">#ECDCFF</item>
+        <item name="colorOnPrimaryContainer">#25005B</item>
+        <item name="colorSecondary">#635B70</item>
+        <item name="colorOnSecondary">#FFFFFF</item>
+        <item name="colorSecondaryContainer">#E9DEF7</item>
+        <item name="colorOnSecondaryContainer">#1F182B</item>
+        <item name="colorTertiary">#7F525E</item>
+        <item name="colorOnTertiary">#FFFFFF</item>
+        <item name="colorTertiaryContainer">#FFD9E2</item>
+        <item name="colorOnTertiaryContainer">#32101B</item>
+        <item name="colorError">#BA1B1B</item>
+        <item name="colorErrorContainer">#FFDAD4</item>
+        <item name="colorOnError">#FFFFFF</item>
+        <item name="colorOnErrorContainer">#410001</item>
+        <item name="android:colorBackground">#FFFBFD</item>
+        <item name="colorOnBackground">#1D1B1F</item>
+        <item name="colorSurface">#FFFBFD</item>
+        <item name="colorOnSurface">#1D1B1F</item>
+        <item name="colorSurfaceVariant">#E7E0EB</item>
+        <item name="colorOnSurfaceVariant">#49454E</item>
+        <item name="colorOutline">#7A757F</item>
+        <item name="colorOnSurfaceInverse">#F5EFF4</item>
+        <item name="colorSurfaceInverse">#323033</item>
+        <item name="colorPrimaryInverse">#D4BAFF</item>
+    </style>
+
+    <style name="blue">
+        <item name="colorPrimary">#4355B9</item>
+        <item name="colorOnPrimary">#FFFFFF</item>
+        <item name="colorPrimaryContainer">#DDE0FF</item>
+        <item name="colorOnPrimaryContainer">#000D61</item>
+        <item name="colorSecondary">#5B5D71</item>
+        <item name="colorOnSecondary">#FFFFFF</item>
+        <item name="colorSecondaryContainer">#E0E1FA</item>
+        <item name="colorOnSecondaryContainer">#171A2C</item>
+        <item name="colorTertiary">#77536D</item>
+        <item name="colorOnTertiary">#FFFFFF</item>
+        <item name="colorTertiaryContainer">#FFD7F3</item>
+        <item name="colorOnTertiaryContainer">#2D1228</item>
+        <item name="colorError">#BA1B1B</item>
+        <item name="colorErrorContainer">#FFDAD4</item>
+        <item name="colorOnError">#FFFFFF</item>
+        <item name="colorOnErrorContainer">#410001</item>
+        <item name="android:colorBackground">#FEFBFF</item>
+        <item name="colorOnBackground">#1B1B1F</item>
+        <item name="colorSurface">#FEFBFF</item>
+        <item name="colorOnSurface">#1B1B1F</item>
+        <item name="colorSurfaceVariant">#E3E1EC</item>
+        <item name="colorOnSurfaceVariant">#46464F</item>
+        <item name="colorOutline">#767680</item>
+        <item name="colorOnSurfaceInverse">#F3F0F5</item>
+        <item name="colorSurfaceInverse">#303034</item>
+        <item name="colorPrimaryInverse">#B9C3FF</item>
+    </style>
+
+    <style name="skyblue">
+        <item name="colorPrimary">#006494</item>
+        <item name="colorOnPrimary">#FFFFFF</item>
+        <item name="colorPrimaryContainer">#C8E6FF</item>
+        <item name="colorOnPrimaryContainer">#001E31</item>
+        <item name="colorSecondary">#50606E</item>
+        <item name="colorOnSecondary">#FFFFFF</item>
+        <item name="colorSecondaryContainer">#D3E4F5</item>
+        <item name="colorOnSecondaryContainer">#0C1D29</item>
+        <item name="colorTertiary">#65597B</item>
+        <item name="colorOnTertiary">#FFFFFF</item>
+        <item name="colorTertiaryContainer">#ECDCFF</item>
+        <item name="colorOnTertiaryContainer">#201634</item>
+        <item name="colorError">#BA1B1B</item>
+        <item name="colorErrorContainer">#FFDAD4</item>
+        <item name="colorOnError">#FFFFFF</item>
+        <item name="colorOnErrorContainer">#410001</item>
+        <item name="android:colorBackground">#FCFCFF</item>
+        <item name="colorOnBackground">#1A1C1E</item>
+        <item name="colorSurface">#FCFCFF</item>
+        <item name="colorOnSurface">#1A1C1E</item>
+        <item name="colorSurfaceVariant">#DEE3EA</item>
+        <item name="colorOnSurfaceVariant">#41474D</item>
+        <item name="colorOutline">#72787E</item>
+        <item name="colorOnSurfaceInverse">#F0F0F3</item>
+        <item name="colorSurfaceInverse">#2F3032</item>
+        <item name="colorPrimaryInverse">#8BCEFF</item>
+    </style>
+
+    <style name="green">
+        <item name="colorPrimary">#006E17</item>
+        <item name="colorOnPrimary">#FFFFFF</item>
+        <item name="colorPrimaryContainer">#93F990</item>
+        <item name="colorOnPrimaryContainer">#002203</item>
+        <item name="colorSecondary">#52634F</item>
+        <item name="colorOnSecondary">#FFFFFF</item>
+        <item name="colorSecondaryContainer">#D5E8CE</item>
+        <item name="colorOnSecondaryContainer">#101F0F</item>
+        <item name="colorTertiary">#38656A</item>
+        <item name="colorOnTertiary">#FFFFFF</item>
+        <item name="colorTertiaryContainer">#BCEBF0</item>
+        <item name="colorOnTertiaryContainer">#001F23</item>
+        <item name="colorError">#BA1B1B</item>
+        <item name="colorErrorContainer">#FFDAD4</item>
+        <item name="colorOnError">#FFFFFF</item>
+        <item name="colorOnErrorContainer">#410001</item>
+        <item name="android:colorBackground">#FCFDF6</item>
+        <item name="colorOnBackground">#1A1C19</item>
+        <item name="colorSurface">#FCFDF6</item>
+        <item name="colorOnSurface">#1A1C19</item>
+        <item name="colorSurfaceVariant">#DEE5D8</item>
+        <item name="colorOnSurfaceVariant">#424840</item>
+        <item name="colorOutline">#73796F</item>
+        <item name="colorOnSurfaceInverse">#F0F1EB</item>
+        <item name="colorSurfaceInverse">#2F312D</item>
+        <item name="colorPrimaryInverse">#78DC77</item>
+    </style>
+
+    <style name="brown">
+        <item name="colorPrimary">#9A4523</item>
+        <item name="colorOnPrimary">#FFFFFF</item>
+        <item name="colorPrimaryContainer">#FFDBCD</item>
+        <item name="colorOnPrimaryContainer">#380C00</item>
+        <item name="colorSecondary">#77574C</item>
+        <item name="colorOnSecondary">#FFFFFF</item>
+        <item name="colorSecondaryContainer">#FFDBCD</item>
+        <item name="colorOnSecondaryContainer">#2C160D</item>
+        <item name="colorTertiary">#695E2F</item>
+        <item name="colorOnTertiary">#FFFFFF</item>
+        <item name="colorTertiaryContainer">#F1E2A7</item>
+        <item name="colorOnTertiaryContainer">#221B00</item>
+        <item name="colorError">#BA1B1B</item>
+        <item name="colorErrorContainer">#FFDAD4</item>
+        <item name="colorOnError">#FFFFFF</item>
+        <item name="colorOnErrorContainer">#410001</item>
+        <item name="android:colorBackground">#FCFCFC</item>
+        <item name="colorOnBackground">#201A18</item>
+        <item name="colorSurface">#FCFCFC</item>
+        <item name="colorOnSurface">#201A18</item>
+        <item name="colorSurfaceVariant">#F5DED6</item>
+        <item name="colorOnSurfaceVariant">#52433E</item>
+        <item name="colorOutline">#85736D</item>
+        <item name="colorOnSurfaceInverse">#FCEEEA</item>
+        <item name="colorSurfaceInverse">#362F2D</item>
+        <item name="colorPrimaryInverse">#FFB598</item>
+    </style>
 </resources>
--- a/app/src/main/res/xml/preferences.xml
+++ b/app/src/main/res/xml/preferences.xml
@@ -15,6 +15,15 @@
            app:iconSpaceReserved="false"
            app:singleLineTitle="false" />

+        <ListPreference
+            android:key="@string/setting_key_theme_color"
+            android:title="@string/settings_theme_color"
+            android:defaultValue="@string/settings_key_system_theme"
+            android:entries="@array/color_value_strings"
+            android:entryValues="@array/color_values"
+            app:iconSpaceReserved="false"
+            app:singleLineTitle="false" />
+
        <SwitchPreferenceCompat
            android:defaultValue="false"
            android:key="@string/settings_key_oled_dark"