From ea24056554f307f4f8f84b0ab6a808730d6acfa4 Mon Sep 17 00:00:00 2001
From: Harsh Shandilya <me@msfjarvis.dev>
Date: Sun, 7 Feb 2021 12:49:00 +0530
Subject: Redo authentication modes UI with Chips (#1297)

---
 .../aps/ui/git/config/GitServerConfigActivity.kt   |  8 ++--
 app/src/main/res/color/chip_surface_color.xml      |  9 +++++
 app/src/main/res/color/chip_text_color.xml         |  9 +++++
 app/src/main/res/layout/activity_git_clone.xml     | 47 +++++++---------------
 app/src/main/res/values-night/colors.xml           |  1 +
 app/src/main/res/values-v27/styles.xml             | 11 -----
 app/src/main/res/values-v27/themes.xml             | 11 +++++
 app/src/main/res/values/colors.xml                 |  1 +
 app/src/main/res/values/styles.xml                 | 44 ++++++++------------
 app/src/main/res/values/themes.xml                 | 34 ++++++++++++++++
 10 files changed, 100 insertions(+), 75 deletions(-)
 create mode 100644 app/src/main/res/color/chip_surface_color.xml
 create mode 100644 app/src/main/res/color/chip_text_color.xml
 delete mode 100644 app/src/main/res/values-v27/styles.xml
 create mode 100644 app/src/main/res/values-v27/themes.xml
 create mode 100644 app/src/main/res/values/themes.xml

(limited to 'app')

diff --git a/app/src/main/java/dev/msfjarvis/aps/ui/git/config/GitServerConfigActivity.kt b/app/src/main/java/dev/msfjarvis/aps/ui/git/config/GitServerConfigActivity.kt
index a964e150..0c250d87 100644
--- a/app/src/main/java/dev/msfjarvis/aps/ui/git/config/GitServerConfigActivity.kt
+++ b/app/src/main/java/dev/msfjarvis/aps/ui/git/config/GitServerConfigActivity.kt
@@ -63,8 +63,8 @@ class GitServerConfigActivity : BaseGitActivity() {
                 AuthMode.OpenKeychain -> check(binding.authModeOpenKeychain.id)
                 AuthMode.None -> check(View.NO_ID)
             }
-            addOnButtonCheckedListener { _, _, _ ->
-                when (checkedButtonId) {
+            setOnCheckedChangeListener { _, checkedId ->
+                when (checkedId) {
                     binding.authModeSshKey.id -> newAuthMode = AuthMode.SshKey
                     binding.authModeOpenKeychain.id -> newAuthMode = AuthMode.OpenKeychain
                     binding.authModePassword.id -> newAuthMode = AuthMode.Password
@@ -184,13 +184,13 @@ class GitServerConfigActivity : BaseGitActivity() {
             authModeSshKey.isVisible = false
             authModeOpenKeychain.isVisible = false
             authModePassword.isVisible = true
-            if (authModeGroup.checkedButtonId != authModePassword.id)
+            if (authModeGroup.checkedChipId != authModePassword.id)
                 authModeGroup.check(View.NO_ID)
         } else {
             authModeSshKey.isVisible = true
             authModeOpenKeychain.isVisible = true
             authModePassword.isVisible = true
-            if (authModeGroup.checkedButtonId == View.NO_ID)
+            if (authModeGroup.checkedChipId == View.NO_ID)
                 authModeGroup.check(authModeSshKey.id)
         }
     }
diff --git a/app/src/main/res/color/chip_surface_color.xml b/app/src/main/res/color/chip_surface_color.xml
new file mode 100644
index 00000000..e436e156
--- /dev/null
+++ b/app/src/main/res/color/chip_surface_color.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright © 2014-2021 The Android Password Store Authors. All Rights Reserved.
+  ~ SPDX-License-Identifier: GPL-3.0-only
+  -->
+
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="@color/secondary_light_color" android:state_checked="true"/>
+    <item android:color="?attr/colorSecondary"/>
+</selector>
diff --git a/app/src/main/res/color/chip_text_color.xml b/app/src/main/res/color/chip_text_color.xml
new file mode 100644
index 00000000..53c118a3
--- /dev/null
+++ b/app/src/main/res/color/chip_text_color.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright © 2014-2021 The Android Password Store Authors. All Rights Reserved.
+  ~ SPDX-License-Identifier: GPL-3.0-only
+  -->
+
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="?attr/colorSurface" android:state_checked="true"/>
+    <item android:color="?attr/colorOnSecondary"/>
+</selector>
diff --git a/app/src/main/res/layout/activity_git_clone.xml b/app/src/main/res/layout/activity_git_clone.xml
index 890cc19b..5e29e06f 100644
--- a/app/src/main/res/layout/activity_git_clone.xml
+++ b/app/src/main/res/layout/activity_git_clone.xml
@@ -33,8 +33,7 @@
             android:id="@+id/label_server_url"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
-            android:layout_marginStart="8dp"
-            android:layout_marginTop="8dp"
+            android:layout_margin="8dp"
             android:hint="@string/server_url"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
@@ -54,8 +53,7 @@
             android:id="@+id/label_server_branch"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
-            android:layout_marginStart="8dp"
-            android:layout_marginTop="8dp"
+            android:layout_margin="8dp"
             android:hint="@string/server_branch"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
@@ -82,51 +80,36 @@
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toBottomOf="@id/label_server_branch" />
 
-        <com.google.android.material.button.MaterialButtonToggleGroup
+        <com.google.android.material.chip.ChipGroup
             android:id="@+id/auth_mode_group"
-            style="@style/TextAppearance.MaterialComponents.Headline1"
-            android:layout_width="0dp"
+            android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginStart="8dp"
-            android:layout_marginTop="8dp"
-            app:layout_constraintEnd_toEndOf="parent"
+            android:layout_margin="8dp"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toBottomOf="@id/label_auth_mode"
             app:singleSelection="true">
 
-            <com.google.android.material.button.MaterialButton
+            <com.google.android.material.chip.Chip
                 android:id="@+id/auth_mode_ssh_key"
-                style="?attr/materialButtonOutlinedStyle"
+                style="@style/AppTheme.Chip.Choice"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:layout_weight="1"
-                android:minWidth="0dp"
-                android:padding="8dp"
-                android:text="@string/connection_mode_ssh_key"
-                android:textSize="@dimen/toggle_group_text_size" />
+                android:text="@string/connection_mode_ssh_key" />
 
-            <com.google.android.material.button.MaterialButton
+            <com.google.android.material.chip.Chip
                 android:id="@+id/auth_mode_password"
-                style="?attr/materialButtonOutlinedStyle"
+                style="@style/AppTheme.Chip.Choice"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:layout_weight="1"
-                android:minWidth="0dp"
-                android:padding="8dp"
-                android:text="@string/connection_mode_basic_authentication"
-                android:textSize="@dimen/toggle_group_text_size" />
+                android:text="@string/connection_mode_basic_authentication" />
 
-            <com.google.android.material.button.MaterialButton
+            <com.google.android.material.chip.Chip
                 android:id="@+id/auth_mode_open_keychain"
-                style="?attr/materialButtonOutlinedStyle"
+                style="@style/AppTheme.Chip.Choice"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:layout_weight="1"
-                android:minWidth="0dp"
-                android:padding="8dp"
-                android:text="@string/connection_mode_openkeychain"
-                android:textSize="@dimen/toggle_group_text_size" />
-        </com.google.android.material.button.MaterialButtonToggleGroup>
+                android:text="@string/connection_mode_openkeychain" />
+        </com.google.android.material.chip.ChipGroup>
 
         <com.google.android.material.button.MaterialButton
             android:id="@+id/save_button"
diff --git a/app/src/main/res/values-night/colors.xml b/app/src/main/res/values-night/colors.xml
index 14f6f2d8..4a17f7f9 100644
--- a/app/src/main/res/values-night/colors.xml
+++ b/app/src/main/res/values-night/colors.xml
@@ -8,6 +8,7 @@
     <color name="primary_color">#ff111111</color>
     <color name="primary_light_color">#ff373737</color>
     <color name="secondary_color">#ff3b6888</color>
+    <color name="secondary_light_color">#ff6b96b8</color>
     <color name="primary_text_color">#ffffffff</color>
 
     <!-- Theme variables -->
diff --git a/app/src/main/res/values-v27/styles.xml b/app/src/main/res/values-v27/styles.xml
deleted file mode 100644
index eeb92876..00000000
--- a/app/src/main/res/values-v27/styles.xml
+++ /dev/null
@@ -1,11 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?><!--
-  ~ Copyright © 2014-2020 The Android Password Store Authors. All Rights Reserved.
-  ~ SPDX-License-Identifier: GPL-3.0-only
-  -->
-
-<resources>
-
-    <style name="AppTheme" parent="APSTheme">
-        <item name="android:windowLightNavigationBar">@bool/light_status_bar</item>
-    </style>
-</resources>
diff --git a/app/src/main/res/values-v27/themes.xml b/app/src/main/res/values-v27/themes.xml
new file mode 100644
index 00000000..eeb92876
--- /dev/null
+++ b/app/src/main/res/values-v27/themes.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright © 2014-2020 The Android Password Store Authors. All Rights Reserved.
+  ~ SPDX-License-Identifier: GPL-3.0-only
+  -->
+
+<resources>
+
+    <style name="AppTheme" parent="APSTheme">
+        <item name="android:windowLightNavigationBar">@bool/light_status_bar</item>
+    </style>
+</resources>
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index b090c761..5d2f769f 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -9,6 +9,7 @@
     <color name="primary_light_color">@color/white</color>
     <color name="secondary_color">#003e5b</color>
     <color name="secondary_dark_color">#001831</color>
+    <color name="secondary_light_color">#3b6888</color>
     <color name="primary_text_color">#212121</color>
     <color name="white">#ffffffff</color>
 
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index 8b42d91e..293bdb9b 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -5,34 +5,6 @@
 
 <resources>
 
-    <!-- Base application theme. -->
-    <style name="APSTheme" parent="Theme.MaterialComponents.DayNight">
-        <item name="colorPrimary">@color/primary_color</item>
-        <item name="colorOnPrimary">@color/color_control_normal</item>
-        <item name="colorPrimaryDark">@color/primary_color</item>
-        <item name="colorPrimaryVariant">@color/primary_light_color</item>
-        <item name="colorSecondary">@color/secondary_color</item>
-        <item name="colorSecondaryVariant">@color/secondary_dark_color</item>
-        <item name="colorOnSecondary">@color/white</item>
-        <item name="colorSurface">@color/primary_color</item>
-        <item name="colorOnSurface">@color/color_control_normal</item>
-        <item name="colorControlNormal">@color/color_control_normal</item>
-        <item name="android:textColor">@color/primary_text_color</item>
-        <item name="android:colorBackgroundFloating">@color/primary_color</item>
-        <item name="android:statusBarColor">@color/status_bar_color</item>
-        <item name="android:navigationBarColor">@color/navigation_bar_color</item>
-        <item name="android:windowLightStatusBar">@bool/light_status_bar</item>
-        <item name="actionModeStyle">@style/ActionMode</item>
-        <item name="alertDialogTheme">@style/AppTheme.Dialog</item>
-        <item name="materialAlertDialogTheme">@style/AppTheme.Dialog</item>
-        <item name="materialButtonStyle">@style/AppTheme.MaterialButton</item>
-        <item name="materialButtonOutlinedStyle">@style/AppTheme.OutlinedButton</item>
-        <item name="bottomSheetDialogTheme">@style/BottomSheetDialogTheme</item>
-        <item name="textInputStyle">@style/AppTheme.TextInputLayout</item>
-    </style>
-
-    <style name="AppTheme" parent="APSTheme" />
-
     <style name="AppTheme.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
         <item name="boxStrokeColor">@color/outlined_box_selector</item>
         <item name="hintTextColor">?attr/colorSecondary</item>
@@ -63,6 +35,22 @@
         <item name="colorSecondary">@color/secondary_color</item>
     </style>
 
+    <style name="AppTheme.Chip.Choice" parent="Widget.MaterialComponents.Chip.Choice">
+        <item name="chipSurfaceColor">@color/chip_surface_color</item>
+        <item name="android:textColor">@color/chip_text_color</item>
+        <item name="shapeAppearanceOverlay">@style/ShapeAppearance.AppTheme.SmallComponent</item>
+        <item name="textAppearanceBody2">@style/TextAppearance.AppTheme.Body2</item>
+    </style>
+
+    <style name="TextAppearance.AppTheme.Body2" parent="TextAppearance.MaterialComponents.Body2">
+        <item name="android:textStyle">bold</item>
+    </style>
+
+    <style name="ShapeAppearance.AppTheme.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
+        <item name="cornerFamily">rounded</item>
+        <item name="cornerSize">8dp</item>
+    </style>
+
     <style name="ActionMode" parent="@style/Widget.AppCompat.ActionMode">
         <item name="background">@color/primary_color</item>
     </style>
diff --git a/app/src/main/res/values/themes.xml b/app/src/main/res/values/themes.xml
new file mode 100644
index 00000000..bf32180c
--- /dev/null
+++ b/app/src/main/res/values/themes.xml
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright © 2014-2020 The Android Password Store Authors. All Rights Reserved.
+  ~ SPDX-License-Identifier: GPL-3.0-only
+  -->
+
+<resources>
+    <!-- Base application theme. -->
+    <style name="APSTheme" parent="Theme.MaterialComponents.DayNight">
+        <item name="colorPrimary">@color/primary_color</item>
+        <item name="colorOnPrimary">@color/color_control_normal</item>
+        <item name="colorPrimaryDark">@color/primary_color</item>
+        <item name="colorPrimaryVariant">@color/primary_light_color</item>
+        <item name="colorSecondary">@color/secondary_color</item>
+        <item name="colorSecondaryVariant">@color/secondary_dark_color</item>
+        <item name="colorOnSecondary">@color/white</item>
+        <item name="colorSurface">@color/primary_color</item>
+        <item name="colorOnSurface">@color/color_control_normal</item>
+        <item name="colorControlNormal">@color/color_control_normal</item>
+        <item name="android:textColor">@color/primary_text_color</item>
+        <item name="android:colorBackgroundFloating">@color/primary_color</item>
+        <item name="android:statusBarColor">@color/status_bar_color</item>
+        <item name="android:navigationBarColor">@color/navigation_bar_color</item>
+        <item name="android:windowLightStatusBar">@bool/light_status_bar</item>
+        <item name="actionModeStyle">@style/ActionMode</item>
+        <item name="alertDialogTheme">@style/AppTheme.Dialog</item>
+        <item name="materialAlertDialogTheme">@style/AppTheme.Dialog</item>
+        <item name="materialButtonStyle">@style/AppTheme.MaterialButton</item>
+        <item name="materialButtonOutlinedStyle">@style/AppTheme.OutlinedButton</item>
+        <item name="bottomSheetDialogTheme">@style/BottomSheetDialogTheme</item>
+        <item name="textInputStyle">@style/AppTheme.TextInputLayout</item>
+    </style>
+
+    <style name="AppTheme" parent="APSTheme" />
+</resources>
-- 
cgit v1.2.3