From 098e9d8fc2e0760bc576ca65199de45878148100 Mon Sep 17 00:00:00 2001
From: Phillip Thelen <phillip@habitica.com>
Date: Wed, 26 Aug 2020 17:46:39 +0200
Subject: [PATCH] Design tweaks

---
 Habitica/res/drawable/checklist_unchecked.xml |  1 -
 .../res/drawable/round_checklist_checkbox.xml |  5 ++++
 .../res/drawable/round_checklist_checked.xml  | 12 +++++++++
 .../drawable/round_checklist_unchecked.xml    |  5 ++++
 Habitica/res/layout/avatar_with_bars.xml      |  5 +---
 Habitica/res/layout/checklist_indicator.xml   |  2 ++
 Habitica/res/layout/checklist_item_row.xml    | 27 ++++++++++++-------
 Habitica/res/layout/fragment_items.xml        |  2 +-
 Habitica/res/layout/task_main_content.xml     |  1 +
 Habitica/res/menu/menu_main_activity.xml      |  7 -----
 .../inventory/items/ItemsFragment.kt          |  1 +
 .../social/GuildsOverviewFragment.kt          |  1 +
 .../challenges/ChallengeDetailFragment.kt     |  1 +
 .../challenges/ChallengesOverviewFragment.kt  |  1 +
 .../viewHolders/tasks/BaseTaskViewHolder.kt   |  2 +-
 .../tasks/ChecklistedViewHolder.kt            | 27 ++++++++++++-------
 16 files changed, 67 insertions(+), 33 deletions(-)
 create mode 100644 Habitica/res/drawable/round_checklist_checkbox.xml
 create mode 100644 Habitica/res/drawable/round_checklist_checked.xml
 create mode 100644 Habitica/res/drawable/round_checklist_unchecked.xml

diff --git a/Habitica/res/drawable/checklist_unchecked.xml b/Habitica/res/drawable/checklist_unchecked.xml
index f816d47dd..1109b6b19 100644
--- a/Habitica/res/drawable/checklist_unchecked.xml
+++ b/Habitica/res/drawable/checklist_unchecked.xml
@@ -1,5 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
-
 <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
     <corners android:radius="@dimen/daily_checkbox_corner_radius"/>
     <solid android:color="#A6FFFFFF" />
diff --git a/Habitica/res/drawable/round_checklist_checkbox.xml b/Habitica/res/drawable/round_checklist_checkbox.xml
new file mode 100644
index 000000000..9147e3f7d
--- /dev/null
+++ b/Habitica/res/drawable/round_checklist_checkbox.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_checked="true" android:drawable="@drawable/round_checklist_checked" />
+    <item android:state_checked="false" android:drawable="@drawable/round_checklist_unchecked" />
+</selector>
\ No newline at end of file
diff --git a/Habitica/res/drawable/round_checklist_checked.xml b/Habitica/res/drawable/round_checklist_checked.xml
new file mode 100644
index 000000000..0e5ab35b9
--- /dev/null
+++ b/Habitica/res/drawable/round_checklist_checked.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item>
+        <shape android:shape="oval">
+            <solid android:color="#A6FFFFFF" />
+            <size android:height="20dp" android:width="20dp" />
+        </shape>
+    </item>
+    <item>
+        <bitmap android:src="@drawable/checkmark" android:gravity="center" />
+    </item>
+</layer-list>
diff --git a/Habitica/res/drawable/round_checklist_unchecked.xml b/Habitica/res/drawable/round_checklist_unchecked.xml
new file mode 100644
index 000000000..54c3938e2
--- /dev/null
+++ b/Habitica/res/drawable/round_checklist_unchecked.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
+    <solid android:color="#A6FFFFFF" />
+    <size android:height="20dp" android:width="20dp" />
+</shape>
\ No newline at end of file
diff --git a/Habitica/res/layout/avatar_with_bars.xml b/Habitica/res/layout/avatar_with_bars.xml
index 60d30f300..b9d83cebb 100644
--- a/Habitica/res/layout/avatar_with_bars.xml
+++ b/Habitica/res/layout/avatar_with_bars.xml
@@ -21,7 +21,6 @@
                 android:layout_height="@dimen/avatar_header_height"
                 android:layout_gravity="center_vertical"
                 android:layout_marginEnd="20dp"
-            android:layout_marginStart="2dp"
                 android:contentDescription="@string/sidebar_avatar"
                 app:showBackground="true"
                 app:showMount="true"
@@ -64,9 +63,7 @@
     <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:gravity="center_vertical"
-            android:paddingBottom="6dp"
-            android:paddingTop="2dp">
+            android:gravity="center_vertical">
 
         <TextView
                 android:id="@+id/lvl_tv"
diff --git a/Habitica/res/layout/checklist_indicator.xml b/Habitica/res/layout/checklist_indicator.xml
index f1d746d87..5d3fca034 100644
--- a/Habitica/res/layout/checklist_indicator.xml
+++ b/Habitica/res/layout/checklist_indicator.xml
@@ -7,6 +7,8 @@
     android:gravity="center"
     android:layout_gravity="center"
     android:layout_marginEnd="12dp"
+    android:layout_marginTop="12dp"
+    android:layout_marginBottom="12dp"
     android:orientation="vertical">
 
         <TextView
diff --git a/Habitica/res/layout/checklist_item_row.xml b/Habitica/res/layout/checklist_item_row.xml
index 9a850450a..3e6450a79 100644
--- a/Habitica/res/layout/checklist_item_row.xml
+++ b/Habitica/res/layout/checklist_item_row.xml
@@ -1,7 +1,8 @@
 <?xml version="1.0" encoding="utf-8"?>
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
-    android:layout_height="wrap_content">
+    android:layout_height="wrap_content"
+    xmlns:tools="http://schemas.android.com/tools">
     <LinearLayout
         android:orientation="horizontal" android:layout_width="match_parent"
         android:layout_height="fill_parent"
@@ -9,14 +10,22 @@
         <FrameLayout
             android:id="@+id/checkBoxHolder"
             android:layout_width="@dimen/button_width"
-            android:layout_height="match_parent">
-        <CheckBox
-            android:id="@+id/checkBox"
-            android:layout_width="@dimen/checkbox_size"
-            android:layout_height="@dimen/checkbox_size"
-            android:gravity="center"
-            android:button="@drawable/checklist_checkbox"
-            android:layout_gravity="center" />
+            android:layout_height="match_parent"
+            tools:background="@color/red_10">
+            <FrameLayout
+                android:id="@+id/checkBoxBackground"
+                android:layout_width="20dp"
+                android:layout_height="20dp"
+                android:gravity="center"
+                android:background="@drawable/checklist_unchecked"
+                android:layout_gravity="center">
+                <ImageView
+                    android:id="@+id/checkmark"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_gravity="center"
+                    android:src="@drawable/checkmark" />
+            </FrameLayout>
         </FrameLayout>
         <com.habitrpg.android.habitica.ui.views.HabiticaEmojiTextView
             android:id="@+id/checkedTextView"
diff --git a/Habitica/res/layout/fragment_items.xml b/Habitica/res/layout/fragment_items.xml
index b34771600..fe9c93314 100644
--- a/Habitica/res/layout/fragment_items.xml
+++ b/Habitica/res/layout/fragment_items.xml
@@ -16,7 +16,7 @@
         android:id="@+id/refreshLayout"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
-        android:background="@color/gray_700"
+        android:background="@color/white"
         app:layout_behavior="@string/appbar_scrolling_view_behavior">
             <com.habitrpg.android.habitica.ui.helpers.RecyclerViewEmptySupport
                 android:id="@+id/recyclerView"
diff --git a/Habitica/res/layout/task_main_content.xml b/Habitica/res/layout/task_main_content.xml
index 3ddaa14ab..befb2f00e 100644
--- a/Habitica/res/layout/task_main_content.xml
+++ b/Habitica/res/layout/task_main_content.xml
@@ -6,6 +6,7 @@
     android:layout_width="0dp"
     android:layout_height="wrap_content"
     android:layout_weight="1"
+    android:layout_gravity="center_vertical"
     android:paddingTop="@dimen/task_top_bottom_padding"
     android:paddingBottom="@dimen/task_top_bottom_padding"
     android:paddingEnd="@dimen/task_text_padding"
diff --git a/Habitica/res/menu/menu_main_activity.xml b/Habitica/res/menu/menu_main_activity.xml
index 7225931c4..069a61246 100644
--- a/Habitica/res/menu/menu_main_activity.xml
+++ b/Habitica/res/menu/menu_main_activity.xml
@@ -2,13 +2,6 @@
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     tools:context="com.habitrpg.android.habitica.TaskActivity">
-
-    <item
-        android:id="@+id/action_reload"
-        android:icon="@drawable/ic_refresh_white"
-        android:title="@string/action_refresh"
-        app:showAsAction="never"
-        app:actionViewClass="android.widget.ImageButton"/>
     <item android:id="@+id/action_search"
         android:title="@string/search"
         android:icon="@drawable/ic_search"
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/inventory/items/ItemsFragment.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/inventory/items/ItemsFragment.kt
index e49ea9a0d..64fc03f08 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/inventory/items/ItemsFragment.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/inventory/items/ItemsFragment.kt
@@ -19,6 +19,7 @@ class ItemsFragment : BaseMainFragment() {
     override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                               savedInstanceState: Bundle?): View? {
         this.usesTabLayout = true
+        this.hidesToolbar = true
         super.onCreateView(inflater, container, savedInstanceState)
         return inflater.inflate(R.layout.fragment_viewpager, container, false)
     }
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/GuildsOverviewFragment.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/GuildsOverviewFragment.kt
index d421e96a6..bf8a3304a 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/GuildsOverviewFragment.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/GuildsOverviewFragment.kt
@@ -39,6 +39,7 @@ class GuildsOverviewFragment : BaseMainFragment(), androidx.swiperefreshlayout.w
 
     override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                               savedInstanceState: Bundle?): View? {
+        this.hidesToolbar = true
         super.onCreateView(inflater, container, savedInstanceState)
         binding = FragmentGuildsOverviewBinding.inflate(inflater, container, false)
         return binding?.root
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengeDetailFragment.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengeDetailFragment.kt
index 17bd3a0ae..d728f4efe 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengeDetailFragment.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengeDetailFragment.kt
@@ -70,6 +70,7 @@ class ChallengeDetailFragment: BaseMainFragment() {
     }
 
     override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
+        this.hidesToolbar = true
         super.onCreateView(inflater, container, savedInstanceState)
         return container?.inflate(R.layout.fragment_challenge_detail)
     }
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengesOverviewFragment.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengesOverviewFragment.kt
index 752f43090..bb6a87d96 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengesOverviewFragment.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/social/challenges/ChallengesOverviewFragment.kt
@@ -30,6 +30,7 @@ class ChallengesOverviewFragment : BaseMainFragment() {
     override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                               savedInstanceState: Bundle?): View? {
         this.usesTabLayout = true
+        this.hidesToolbar = true
         super.onCreateView(inflater, container, savedInstanceState)
         return inflater.inflate(R.layout.fragment_viewpager, container, false)
     }
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/BaseTaskViewHolder.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/BaseTaskViewHolder.kt
index 3327fb8e6..22913a83d 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/BaseTaskViewHolder.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/BaseTaskViewHolder.kt
@@ -40,7 +40,7 @@ abstract class BaseTaskViewHolder constructor(itemView: View, var scoreTaskFunc:
     private val expandNotesButton: Button? by bindOptionalView(R.id.expand_notes_button)
     private val syncingView: ProgressBar? by bindOptionalView(R.id.syncing_view)
     private val errorIconView: ImageButton? by bindOptionalView(R.id.error_icon)
-    protected val taskGray: Int by bindColor(itemView.context, R.color.task_gray)
+    protected val taskGray: Int by bindColor(itemView.context, R.color.gray_600)
     protected val streakTextView: TextView by bindView(itemView, R.id.streakTextView)
     protected val reminderTextView: TextView by bindView(itemView, R.id.reminder_textview)
 
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/ChecklistedViewHolder.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/ChecklistedViewHolder.kt
index 1ee593f0a..31e708a93 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/ChecklistedViewHolder.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/viewHolders/tasks/ChecklistedViewHolder.kt
@@ -7,10 +7,7 @@ import android.view.LayoutInflater
 import android.view.TouchDelegate
 import android.view.View
 import android.view.ViewGroup
-import android.widget.CheckBox
-import android.widget.CompoundButton
-import android.widget.LinearLayout
-import android.widget.TextView
+import android.widget.*
 import androidx.core.content.ContextCompat
 import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
@@ -53,7 +50,11 @@ abstract class ChecklistedViewHolder(itemView: View, scoreTaskFunc: ((Task, Task
         if (this.shouldDisplayAsActive(newTask) && !newTask.isPendingApproval) {
             this.checkboxHolder.setBackgroundResource(newTask.lightTaskColor)
         } else {
-            this.checkboxHolder.setBackgroundColor(this.taskGray)
+            if (newTask.completed) {
+                this.checkboxHolder.setBackgroundResource(R.color.gray_700)
+            } else {
+                this.checkboxHolder.setBackgroundColor(this.taskGray)
+            }
         }
         this.checklistCompletedTextView.text = newTask.completedChecklistCount.toString()
         this.checklistAllTextView.text = newTask.checklist?.size.toString()
@@ -75,7 +76,10 @@ abstract class ChecklistedViewHolder(itemView: View, scoreTaskFunc: ((Task, Task
                 checklistView.removeAllViews()
                 for (item in this.task?.checklist ?: emptyList<ChecklistItem>()) {
                     val itemView = layoutInflater?.inflate(R.layout.checklist_item_row, this.checklistView, false)
-                    val checkbox = itemView?.findViewById<CheckBox>(R.id.checkBox)
+                    val checkboxBackground = itemView?.findViewById<FrameLayout>(R.id.checkBoxBackground)
+                    if (task?.type == Task.TYPE_TODO) {
+                        checkboxBackground?.setBackgroundResource(R.drawable.round_checklist_unchecked)
+                    }
                     val textView = itemView?.findViewById<HabiticaEmojiTextView>(R.id.checkedTextView)
                     // Populate the data into the template view using the data object
                     textView?.text = item.text
@@ -86,15 +90,18 @@ abstract class ChecklistedViewHolder(itemView: View, scoreTaskFunc: ((Task, Task
                                 .observeOn(AndroidSchedulers.mainThread())
                                 .subscribe(Consumer<CharSequence> { textView?.text = it }, RxErrorHandler.handleEmptyError())
                     }
-                    checkbox?.isChecked = item.completed
-                    checkbox?.setOnCheckedChangeListener { _, _ ->
+                    val checkmark = itemView?.findViewById<ImageView>(R.id.checkmark)
+                    checkmark?.drawable?.setTintMode(PorterDuff.Mode.SRC_ATOP)
+                    checkmark?.visibility = if (item.completed) View.VISIBLE else View.GONE
+                    val checkboxHolder = itemView?.findViewById<View>(R.id.checkBoxHolder) as? ViewGroup
+                    checkboxHolder?.setOnClickListener { _ ->
                         task?.let { scoreChecklistItemFunc(it, item) }
                     }
-                    val checkboxHolder = itemView?.findViewById<View>(R.id.checkBoxHolder) as? ViewGroup
-                    expandCheckboxTouchArea(checkboxHolder, checkbox)
                     val color = ContextCompat.getColor(context, if (task?.completed == true || (task?.type == Task.TYPE_DAILY && task?.isDue == false)) {
+                        checkmark?.drawable?.setTint(ContextCompat.getColor(context, R.color.gray_400))
                         R.color.gray_600
                     } else {
+                        checkmark?.drawable?.setTint(ContextCompat.getColor(context, task?.darkTaskColor ?: R.color.gray_400))
                         task?.extraLightTaskColor ?: R.color.gray_600
                     })
                     color.let { checkboxHolder?.setBackgroundColor(it) }