From c85978e4e2f0653192a22353b2b1c12b586cfc47 Mon Sep 17 00:00:00 2001
From: Brayan Oliveira <69634269+brayandso@users.noreply.github.com>
Date: Sun, 22 Dec 2024 08:48:30 -0300
Subject: [PATCH] refactor: replace ConstraintLayouts in reviewer2.xml

They were initially used because of the WIP nature of the reviewer, so they would be able to handle any design decisions

Now that most of the reviewer is implemented, I don't see a need for using ConstraintLayouts anymore, so I am replacing them with LinearLayouts

LinearLayouts are simpler to deal with, have less boilerplate, and make easier to preview changes. They also render faster
---
 .../ui/windows/reviewer/ReviewerFragment.kt   |  4 +-
 AnkiDroid/src/main/res/layout/reviewer2.xml   | 76 +++++++------------
 AnkiDroid/src/main/res/values/dimens.xml      |  3 +
 3 files changed, 32 insertions(+), 51 deletions(-)

diff --git a/AnkiDroid/src/main/java/com/ichi2/anki/ui/windows/reviewer/ReviewerFragment.kt b/AnkiDroid/src/main/java/com/ichi2/anki/ui/windows/reviewer/ReviewerFragment.kt
index 5bcff6cce1d7..b4c62bd7972b 100644
--- a/AnkiDroid/src/main/java/com/ichi2/anki/ui/windows/reviewer/ReviewerFragment.kt
+++ b/AnkiDroid/src/main/java/com/ichi2/anki/ui/windows/reviewer/ReviewerFragment.kt
@@ -27,11 +27,11 @@ import android.view.inputmethod.EditorInfo
 import android.view.inputmethod.InputMethodManager
 import android.webkit.WebView
 import android.widget.FrameLayout
+import android.widget.LinearLayout
 import androidx.activity.result.contract.ActivityResultContracts
 import androidx.annotation.StringRes
 import androidx.appcompat.view.menu.SubMenuBuilder
 import androidx.appcompat.widget.ActionMenuView
-import androidx.constraintlayout.widget.ConstraintLayout
 import androidx.core.content.getSystemService
 import androidx.core.view.ViewCompat
 import androidx.core.view.WindowInsetsCompat
@@ -298,7 +298,7 @@ class ReviewerFragment :
                     viewModel.onShowAnswer(typedAnswer = typedAnswer)
                 }
             }
-        val answerButtonsLayout = view.findViewById<ConstraintLayout>(R.id.answer_buttons)
+        val answerButtonsLayout = view.findViewById<LinearLayout>(R.id.answer_buttons)
 
         // TODO add some kind of feedback/animation after tapping show answer or the answer buttons
         viewModel.showingAnswer.collectLatestIn(lifecycleScope) { shouldShowAnswer ->
diff --git a/AnkiDroid/src/main/res/layout/reviewer2.xml b/AnkiDroid/src/main/res/layout/reviewer2.xml
index 1db32c052a5a..4b4821bc5b96 100644
--- a/AnkiDroid/src/main/res/layout/reviewer2.xml
+++ b/AnkiDroid/src/main/res/layout/reviewer2.xml
@@ -9,23 +9,23 @@
     android:fitsSystemWindows="true"
     tools:context=".ui.windows.reviewer.ReviewerFragment">
 
-    <androidx.constraintlayout.widget.ConstraintLayout
+    <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="match_parent"
-        android:layout_marginBottom="4dp">
+        android:layout_marginBottom="4dp"
+        android:orientation="vertical">
 
         <com.google.android.material.appbar.AppBarLayout
             android:id="@+id/appbar"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            app:layout_constraintTop_toTopOf="parent">
+            >
 
             <com.google.android.material.appbar.MaterialToolbar
                 android:id="@+id/toolbar"
                 app:navigationIcon="?attr/homeAsUpIndicator"
                 app:navigationContentDescription="@string/abc_action_bar_up_description"
                 android:layout_width="match_parent"
-                app:layout_constraintTop_toTopOf="parent"
                 android:layout_height="?attr/actionBarSize"
                 android:background="?attr/alternativeBackgroundColor"
                 >
@@ -71,29 +71,24 @@
             android:id="@+id/webview_container"
             android:layout_width="match_parent"
             android:layout_height="0dp"
-            android:layout_marginHorizontal="8dp"
+            android:layout_marginHorizontal="@dimen/reviewer_side_margin"
             android:layout_marginBottom="4dp"
-            app:layout_constraintTop_toBottomOf="@id/appbar"
-            app:layout_constraintBottom_toTopOf="@id/type_answer_container"
-            style="@style/CardView.ViewerStyle">
+            style="@style/CardView.ViewerStyle"
+            android:layout_weight="1">
 
             <WebView
                 android:id="@+id/webview"
                 android:layout_width="match_parent"
-                android:layout_height="match_parent">
-            </WebView>
+                android:layout_height="match_parent"/>
 
         </com.google.android.material.card.MaterialCardView>
 
         <!-- Use the same card style of the WebView -->
         <com.google.android.material.card.MaterialCardView
             android:id="@+id/type_answer_container"
-            android:layout_width="0dp"
+            android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            app:layout_constraintStart_toStartOf="@id/webview_container"
-            app:layout_constraintEnd_toEndOf="@id/webview_container"
-            app:layout_constraintTop_toBottomOf="@id/webview_container"
-            app:layout_constraintBottom_toTopOf="@id/buttons_area"
+            android:layout_marginHorizontal="8dp"
             style="@style/CardView.ViewerStyle"
             android:layout_marginTop="4dp"
             android:layout_marginBottom="8dp"
@@ -120,17 +115,12 @@
 
         </com.google.android.material.card.MaterialCardView>
 
-
-
         <FrameLayout
             android:id="@+id/buttons_area"
-            android:layout_width="0dp"
+            android:layout_width="match_parent"
             android:layout_height="@dimen/touch_target"
             android:layout_marginTop="2dp"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintEnd_toEndOf="@id/webview_container"
-            app:layout_constraintStart_toStartOf="@id/webview_container"
-            app:layout_constraintTop_toBottomOf="@id/type_answer_container"
+            android:layout_marginHorizontal="@dimen/reviewer_side_margin"
             >
 
             <com.google.android.material.button.MaterialButton
@@ -143,7 +133,7 @@
                 tools:visibility="gone"
                 />
 
-            <androidx.constraintlayout.widget.ConstraintLayout
+            <LinearLayout
                 android:id="@+id/answer_buttons"
                 android:layout_width="match_parent"
                 android:layout_height="match_parent"
@@ -154,64 +144,52 @@
                 <com.google.android.material.button.MaterialButton
                     android:id="@+id/again_button"
                     android:layout_width="0dp"
-                    android:layout_height="0dp"
+                    android:layout_height="match_parent"
                     android:text="@string/ease_button_again"
                     android:backgroundTint="@color/again_button_bg"
                     android:textColor="@color/again_button_text"
-                    android:layout_marginHorizontal="3dp"
-                    app:layout_constraintTop_toTopOf="parent"
-                    app:layout_constraintBottom_toBottomOf="parent"
-                    app:layout_constraintStart_toStartOf="parent"
-                    app:layout_constraintEnd_toStartOf="@id/hard_button"
+                    android:layout_marginEnd="@dimen/answer_button_margin_horizontal"
                     style="@style/AnswerButton"
+                    android:layout_weight="1"
                     />
 
                 <com.google.android.material.button.MaterialButton
                     android:id="@+id/hard_button"
                     android:layout_width="0dp"
-                    android:layout_height="0dp"
+                    android:layout_height="match_parent"
                     android:text="@string/ease_button_hard"
                     android:backgroundTint="@color/hard_button_bg"
                     android:textColor="@color/hard_button_text"
-                    android:layout_marginHorizontal="3dp"
-                    app:layout_constraintTop_toTopOf="parent"
-                    app:layout_constraintBottom_toBottomOf="parent"
-                    app:layout_constraintStart_toEndOf="@id/again_button"
-                    app:layout_constraintEnd_toStartOf="@id/good_button"
+                    android:layout_marginHorizontal="@dimen/answer_button_margin_horizontal"
                     style="@style/AnswerButton"
+                    android:layout_weight="1"
                     />
 
                 <com.google.android.material.button.MaterialButton
                     android:id="@+id/good_button"
                     android:layout_width="0dp"
-                    android:layout_height="0dp"
+                    android:layout_height="match_parent"
                     android:text="@string/ease_button_good"
                     android:backgroundTint="@color/good_button_bg"
                     android:textColor="@color/good_button_text"
-                    android:layout_marginHorizontal="3dp"
-                    app:layout_constraintTop_toTopOf="parent"
-                    app:layout_constraintBottom_toBottomOf="parent"
-                    app:layout_constraintStart_toEndOf="@id/hard_button"
-                    app:layout_constraintEnd_toStartOf="@id/easy_button"
+                    android:layout_marginHorizontal="@dimen/answer_button_margin_horizontal"
                     style="@style/AnswerButton"
+                    android:layout_weight="1"
                     />
 
                 <com.google.android.material.button.MaterialButton
                     android:id="@+id/easy_button"
                     android:layout_width="0dp"
-                    android:layout_height="0dp"
+                    android:layout_height="match_parent"
                     android:padding="0dp"
                     android:text="@string/ease_button_easy"
                     android:backgroundTint="@color/easy_button_bg"
                     android:textColor="@color/easy_button_text"
-                    android:layout_marginHorizontal="3dp"
-                    app:layout_constraintTop_toTopOf="parent"
-                    app:layout_constraintBottom_toBottomOf="parent"
-                    app:layout_constraintStart_toEndOf="@id/good_button"
-                    app:layout_constraintEnd_toEndOf="parent"
+                    android:layout_marginStart="@dimen/answer_button_margin_horizontal"
                     style="@style/AnswerButton"
+                    android:layout_weight="1"
                     />
-            </androidx.constraintlayout.widget.ConstraintLayout>
+            </LinearLayout>
         </FrameLayout>
-    </androidx.constraintlayout.widget.ConstraintLayout>
+    </LinearLayout>
 </androidx.coordinatorlayout.widget.CoordinatorLayout>
\ No newline at end of file
diff --git a/AnkiDroid/src/main/res/values/dimens.xml b/AnkiDroid/src/main/res/values/dimens.xml
index f2972034785d..246a717470e1 100644
--- a/AnkiDroid/src/main/res/values/dimens.xml
+++ b/AnkiDroid/src/main/res/values/dimens.xml
@@ -33,4 +33,7 @@
     <dimen name="mtrl_snackbar_background_corner_radius">8dp</dimen>
     <dimen name="popup_corner_radius">8dp</dimen>
     <dimen name="dialog_corner_radius">8dp</dimen>
+
+    <dimen name="reviewer_side_margin">8dp</dimen>
+    <dimen name="answer_button_margin_horizontal">3dp</dimen>
 </resources>
\ No newline at end of file