[fix] Settings now use material3 switches.

Migrates to material3. Fixes appbar styles. Adds new themes.
SecUSo · Jan 16, 2024 · 5a3711d · 5a3711d
1 parent 336546a
commit 5a3711d
Show file tree

Hide file tree

Showing 16 changed files with 240 additions and 45 deletions.
diff --git a/app/build.gradle b/app/build.gradle
@@ -71,6 +71,7 @@ dependencies {
     implementation fileTree(dir: 'libs', include: ['*.jar'])
     implementation 'androidx.lifecycle:lifecycle-extensions:2.2.0'
     implementation 'androidx.room:room-testing:2.6.0'
+    implementation 'androidx.preference:preference-ktx:1.2.1'
     testImplementation 'junit:junit:4.13.2'
     implementation 'androidx.appcompat:appcompat:1.6.1'
     implementation 'com.google.android.material:material:1.10.0'

diff --git a/app/src/main/java/org/secuso/privacyfriendlynotes/ui/fragments/SettingsFragment.kt b/app/src/main/java/org/secuso/privacyfriendlynotes/ui/fragments/SettingsFragment.kt
@@ -14,22 +14,21 @@
 package org.secuso.privacyfriendlynotes.ui.fragments
 
 import android.os.Bundle
-import android.preference.PreferenceFragment
 import androidx.appcompat.app.AppCompatDelegate
+import androidx.preference.ListPreference
+import androidx.preference.PreferenceFragmentCompat
 import org.secuso.privacyfriendlynotes.R
 
 /**
  * Fragment that provides the settings.
  * Created by Robin on 11.09.2016.
  */
-class SettingsFragment : PreferenceFragment() {
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        addPreferencesFromResource(R.xml.pref_settings)
-        findPreference("settings_day_night_theme")?.setOnPreferenceChangeListener { _, newValue ->
+class SettingsFragment : PreferenceFragmentCompat() {
+    override fun onCreatePreferences(savedInstanceState: Bundle?, rootKey: String?) {
+        setPreferencesFromResource(R.xml.pref_settings, rootKey)
+        findPreference<ListPreference>("settings_day_night_theme")?.setOnPreferenceChangeListener { _, newValue ->
             AppCompatDelegate.setDefaultNightMode(newValue.toString().toInt())
             true;
         }
-
     }
 }
diff --git a/app/src/main/res/drawable/arrow_back.xml b/app/src/main/res/drawable/arrow_back.xml
@@ -0,0 +1,5 @@
+<vector android:autoMirrored="true" android:height="24dp"
+    android:tint="#FFFFFF" android:viewportHeight="24"
+    android:viewportWidth="24" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M20,11H7.83l5.59,-5.59L12,4l-8,8 8,8 1.41,-1.41L7.83,13H20v-2z"/>
+</vector>
diff --git a/app/src/main/res/drawable/ic_sort_by_alpha_icon_24dp.xml b/app/src/main/res/drawable/ic_sort_by_alpha_icon_24dp.xml
@@ -4,6 +4,6 @@
         android:viewportWidth="24.0"
         android:viewportHeight="24.0">
     <path
-        android:fillColor="?attr/colorIconFill"
+        android:fillColor="@color/white"
         android:pathData="M14.94,4.66h-4.72l2.36,-2.36zM10.25,19.37h4.66l-2.33,2.33zM6.1,6.27L1.6,17.73h1.84l0.92,-2.45h5.11l0.92,2.45h1.84L7.74,6.27L6.1,6.27zM4.97,13.64l1.94,-5.18 1.94,5.18L4.97,13.64zM15.73,16.14h6.12v1.59h-8.53v-1.29l5.92,-8.56h-5.88v-1.6h8.3v1.26l-5.93,8.6z"/>
 </vector>
diff --git a/app/src/main/res/layout/activity_sketch.xml b/app/src/main/res/layout/activity_sketch.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:orientation="vertical"
@@ -28,16 +29,16 @@
             android:theme="@style/AppTheme.NoteHeader.ColorSelector"
             android:layout_width="50dp"
             android:layout_height="match_parent"
-            android:layout_marginTop="-10dp"
             android:id="@+id/btn_color_selector"
+            app:cornerRadius="5dp"
             />
     </LinearLayout>
 
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="0dp"
         android:layout_weight="1"
-        android:background="?attr/colorSurface">
+        android:background="?attr/colorSurfaceVariant">
         <com.simplify.ink.InkView
             android:layout_width="match_parent"
             android:layout_height="match_parent"

diff --git a/app/src/main/res/layout/app_bar_main.xml b/app/src/main/res/layout/app_bar_main.xml
@@ -10,14 +10,14 @@
 
     <com.google.android.material.appbar.AppBarLayout
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:theme="@style/AppTheme.AppBarOverlay">
+        android:layout_height="wrap_content">
 
         <com.google.android.material.appbar.MaterialToolbar
             android:id="@+id/toolbar"
             android:layout_width="match_parent"
             android:layout_height="?attr/actionBarSize"
-            android:background="?attr/colorPrimary" />
+
+            />
 
     </com.google.android.material.appbar.AppBarLayout>
 

diff --git a/app/src/main/res/layout/content_main.xml b/app/src/main/res/layout/content_main.xml
@@ -18,6 +18,7 @@
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:actionViewClass="androidx.appcompat.widget.SearchView"
+            android:theme="@style/AppTheme.SearchView"
             android:imeOptions="flagNoExtractUi"/>
 
         <androidx.recyclerview.widget.RecyclerView

diff --git a/app/src/main/res/layout/dialog_sorting_options_item.xml b/app/src/main/res/layout/dialog_sorting_options_item.xml
@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/alphabetical_ascending"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
@@ -22,5 +23,6 @@
         android:id="@+id/sorting_option_reversed"
         android:layout_width="20dp"
         android:layout_height="20dp"
+        app:tint="?attr/colorIconFill"
         android:layout_gravity="center" />
 </LinearLayout>
diff --git a/app/src/main/res/layout/item_category.xml b/app/src/main/res/layout/item_category.xml
@@ -44,6 +44,8 @@
                         app:iconTint="@color/transparent"
                         app:iconTintMode="add"
                         app:iconPadding="0dp"
+                        app:iconSize="40dp"
+                        app:cornerRadius="5dp"
                         android:theme="@style/AppTheme.CategoryButton" />
                 </androidx.cardview.widget.CardView>
 

diff --git a/app/src/main/res/layout/preference_switch.xml b/app/src/main/res/layout/preference_switch.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Derived from https://github.com/androidx/androidx/blob/005e9694795cee9a42375d80b0d813af9e700ac1/preference/preference/res/layout/preference_widget_switch_compat.xml -->
+<!-- Thanks to https://stackoverflow.com/a/73782598/9077356 -->
+<com.google.android.material.materialswitch.MaterialSwitch
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/switchWidget"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:focusable="false"
+    android:clickable="false"
+    android:background="@null" />
diff --git a/app/src/main/res/values-night/styles.xml b/app/src/main/res/values-night/styles.xml
@@ -1,24 +1,66 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <style name="AppTheme" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
-        <item name="colorPrimary">@color/colorPrimary</item>
-        <item name="colorOnPrimary">@color/white</item>
+    <style name="AppTheme" parent="Theme.Material3.DayNight">
         <item name="colorAccent">@color/colorAccent</item>
-        <item name="colorSurface">@color/colorSurfaceDark</item>
-        <item name="colorOnSurface">@color/white</item>
         <item name="colorSurfaceSecondary">@color/colorSurfaceSecondaryDark</item>
         <item name="colorBackground">@color/colorBackgroundDark</item>
-        <item name="colorOnBackground">@color/white</item>
         <item name="android:windowBackground">@color/colorBackgroundDark</item>
 
+        <item name="colorPrimary">@color/md_theme_dark_primary</item>
+        <item name="colorOnPrimary">@color/md_theme_dark_onPrimary</item>
+        <item name="colorPrimaryContainer">@color/md_theme_dark_primaryContainer</item>
+        <item name="colorOnPrimaryContainer">@color/md_theme_dark_onPrimaryContainer</item>
+        <item name="colorSecondary">@color/md_theme_dark_secondary</item>
+        <item name="colorOnSecondary">@color/md_theme_dark_onSecondary</item>
+        <item name="colorSecondaryContainer">@color/md_theme_dark_secondaryContainer</item>
+        <item name="colorOnSecondaryContainer">@color/md_theme_dark_onSecondaryContainer</item>
+        <item name="colorTertiary">@color/md_theme_dark_tertiary</item>
+        <item name="colorOnTertiary">@color/md_theme_dark_onTertiary</item>
+        <item name="colorTertiaryContainer">@color/md_theme_dark_tertiaryContainer</item>
+        <item name="colorOnTertiaryContainer">@color/md_theme_dark_onTertiaryContainer</item>
+        <item name="colorError">@color/md_theme_dark_error</item>
+        <item name="colorErrorContainer">@color/md_theme_dark_errorContainer</item>
+        <item name="colorOnError">@color/md_theme_dark_onError</item>
+        <item name="colorOnErrorContainer">@color/md_theme_dark_onErrorContainer</item>
+        <item name="android:colorBackground">@color/md_theme_dark_background</item>
+        <item name="colorOnBackground">@color/md_theme_dark_onBackground</item>
+        <item name="colorSurface">@color/md_theme_dark_surface</item>
+        <item name="colorOnSurface">@color/md_theme_dark_onSurface</item>
+        <item name="colorSurfaceVariant">@color/md_theme_dark_surfaceVariant</item>
+        <item name="colorOnSurfaceVariant">@color/md_theme_dark_onSurfaceVariant</item>
+        <item name="colorOutline">@color/md_theme_dark_outline</item>
+        <item name="colorOnSurfaceInverse">@color/md_theme_dark_inverseOnSurface</item>
+        <item name="colorSurfaceInverse">@color/md_theme_dark_inverseSurface</item>
+        <item name="colorPrimaryInverse">@color/md_theme_dark_inversePrimary</item>
+
         <item name="colorNavbarHeaderBackground">@color/colorPrimaryDark</item>
         <item name="colorNavbarHeaderSurface">#476885</item>
         <item name="colorNavbarHeaderText">@color/white</item>
 
         <item name="colorIconFill">@color/white</item>
+        <item name="android:statusBarColor">@color/colorSecuso</item>
+
+        <item name="toolbarStyle">@style/AppTheme.ActionBar</item>
+        <item name="preferenceTheme">@style/ThemeOverlay.App.Preference</item>
+    </style>
+
+    <style name="AppTheme.ActionBar" parent="Widget.Material3.Toolbar.Surface">
+        <item name="android:background">@color/colorSecuso</item>
+    </style>
 
+    <style name="AppTheme.SearchView" parent="AppTheme">
+        <item name="colorControlNormal">@color/white</item>
     </style>
 
+    <style name="ThemeOverlay.App.Preference" parent="PreferenceThemeOverlay">
+        <item name="switchPreferenceCompatStyle">@style/PreferenceMaterialSwitch</item>
+    </style>
+
+    <style name="PreferenceMaterialSwitch" parent="@style/Preference.SwitchPreferenceCompat.Material">
+        <item name="widgetLayout">@layout/preference_switch</item>
+    </style>
+
+
     <style name="AppTheme.PopupOverlay.DialogAlert" parent="Theme.MaterialComponents.DayNight.Dialog.Alert">
         <item name="colorPrimary">?attr/colorOnSurface</item>
     </style>

diff --git a/app/src/main/res/values-v21/styles.xml b/app/src/main/res/values-v21/styles.xml
diff --git a/app/src/main/res/values/attrs.xml b/app/src/main/res/values/attrs.xml
@@ -7,5 +7,30 @@
         <attr name="colorNavbarHeaderSurface" format="color" />
         <attr name="colorNavbarHeaderText" format="color"/>
         <attr name="colorIconFill" format="color" />
+        <attr name="colorPrimary" format="color" />
+        <attr name="colorOnPrimary" format="color" />
+        <attr name="colorPrimaryContainer" format="color" />
+        <attr name="colorOnPrimaryContainer" format="color" />
+        <attr name="colorSecondary" format="color" />
+        <attr name="colorOnSecondary" format="color" />
+        <attr name="colorSecondaryContainer" format="color" />
+        <attr name="colorOnSecondaryContainer" format="color" />
+        <attr name="colorTertiary" format="color" />
+        <attr name="colorOnTertiary" format="color" />
+        <attr name="colorTertiaryContainer" format="color" />
+        <attr name="colorOnTertiaryContainer" format="color" />
+        <attr name="colorError" format="color" />
+        <attr name="colorErrorContainer" format="color" />
+        <attr name="colorOnError" format="color" />
+        <attr name="colorOnErrorContainer" format="color" />
+<!--        <attr name="colorOnBackground" format="color" />-->
+        <attr name="colorSurface" format="color" />
+        <attr name="colorOnSurface" format="color" />
+        <attr name="colorSurfaceVariant" format="color" />
+        <attr name="colorOnSurfaceVariant" format="color" />
+        <attr name="colorOutline" format="color" />
+        <attr name="colorOnSurfaceInverse" format="color" />
+        <attr name="colorSurfaceInverse" format="color" />
+        <attr name="colorPrimaryInverse" format="color" />
     </declare-styleable>
 </resources>
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <!--> SecUSo colors:  <-->
-    <color name="colorPrimary">#024265</color>
+    <color name="colorSecuso">#024265</color>
     <color name="colorPrimaryDark">#024265</color>
     <color name="colorSurface">#FFFFFF</color>
     <color name="colorSurfaceDark">#373a3d</color>
@@ -17,6 +17,71 @@
     <color name="black">#000000</color>
     <color name="middleblue">#8aa5ce</color>
 
+    <!-- Theme Generator based on Secuso   -->
+    <color name="seed">#024265</color>
+    <color name="md_theme_light_primary">#006496</color>
+    <color name="md_theme_light_onPrimary">#FFFFFF</color>
+    <color name="md_theme_light_primaryContainer">#CCE5FF</color>
+    <color name="md_theme_light_onPrimaryContainer">#001E31</color>
+    <color name="md_theme_light_secondary">#006399</color>
+    <color name="md_theme_light_onSecondary">#FFFFFF</color>
+    <color name="md_theme_light_secondaryContainer">#CDE5FF</color>
+    <color name="md_theme_light_onSecondaryContainer">#001D32</color>
+    <color name="md_theme_light_tertiary">#006B56</color>
+    <color name="md_theme_light_onTertiary">#FFFFFF</color>
+    <color name="md_theme_light_tertiaryContainer">#7EF8D5</color>
+    <color name="md_theme_light_onTertiaryContainer">#002018</color>
+    <color name="md_theme_light_error">#BA1A1A</color>
+    <color name="md_theme_light_errorContainer">#FFDAD6</color>
+    <color name="md_theme_light_onError">#FFFFFF</color>
+    <color name="md_theme_light_onErrorContainer">#410002</color>
+    <color name="md_theme_light_background">#FCFCFF</color>
+    <color name="md_theme_light_onBackground">#1A1C1E</color>
+    <color name="md_theme_light_surface">#FCFCFF</color>
+    <color name="md_theme_light_onSurface">#1A1C1E</color>
+    <color name="md_theme_light_surfaceVariant">#DEE3EB</color>
+    <color name="md_theme_light_onSurfaceVariant">#42474E</color>
+    <color name="md_theme_light_outline">#72787E</color>
+    <color name="md_theme_light_inverseOnSurface">#F0F0F4</color>
+    <color name="md_theme_light_inverseSurface">#2F3133</color>
+    <color name="md_theme_light_inversePrimary">#91CDFF</color>
+    <color name="md_theme_light_shadow">#000000</color>
+    <color name="md_theme_light_surfaceTint">#006496</color>
+    <color name="md_theme_light_outlineVariant">#C2C7CE</color>
+    <color name="md_theme_light_scrim">#000000</color>
+
+    <color name="md_theme_dark_primary">#91CDFF</color>
+    <color name="md_theme_dark_onPrimary">#003350</color>
+    <color name="md_theme_dark_primaryContainer">#004B72</color>
+    <color name="md_theme_dark_onPrimaryContainer">#CCE5FF</color>
+    <color name="md_theme_dark_secondary">#95CCFF</color>
+    <color name="md_theme_dark_onSecondary">#003352</color>
+    <color name="md_theme_dark_secondaryContainer">#004A75</color>
+    <color name="md_theme_dark_onSecondaryContainer">#CDE5FF</color>
+    <color name="md_theme_dark_tertiary">#5FDBB9</color>
+    <color name="md_theme_dark_onTertiary">#00382C</color>
+    <color name="md_theme_dark_tertiaryContainer">#005140</color>
+    <color name="md_theme_dark_onTertiaryContainer">#7EF8D5</color>
+    <color name="md_theme_dark_error">#FFB4AB</color>
+    <color name="md_theme_dark_errorContainer">#93000A</color>
+    <color name="md_theme_dark_onError">#690005</color>
+    <color name="md_theme_dark_onErrorContainer">#FFDAD6</color>
+    <color name="md_theme_dark_background">#1A1C1E</color>
+    <color name="md_theme_dark_onBackground">#E2E2E5</color>
+    <color name="md_theme_dark_surface">#1A1C1E</color>
+    <color name="md_theme_dark_onSurface">#E2E2E5</color>
+    <color name="md_theme_dark_surfaceVariant">#42474E</color>
+    <color name="md_theme_dark_onSurfaceVariant">#C2C7CE</color>
+    <color name="md_theme_dark_outline">#8C9198</color>
+    <color name="md_theme_dark_inverseOnSurface">#1A1C1E</color>
+    <color name="md_theme_dark_inverseSurface">#E2E2E5</color>
+    <color name="md_theme_dark_inversePrimary">#006496</color>
+    <color name="md_theme_dark_shadow">#000000</color>
+    <color name="md_theme_dark_surfaceTint">#91CDFF</color>
+    <color name="md_theme_dark_outlineVariant">#42474E</color>
+    <color name="md_theme_dark_scrim">#000000</color>
+
+
     <!-- Other colors-->
     <color name="black_semi_transparent">#B2000000</color>
     <color name="background">#e5e5e5</color>