feat(browser): implement 'Manage columns'

A user can long press the column headings or edit them from the options to add/remove multiple columns Issue 17780
ankidroid · Jan 13, 2025 · b4e24c1 · b4e24c1
1 parent 2ea969a
commit b4e24c1
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 4 deletions.
diff --git a/AnkiDroid/src/main/java/com/ichi2/anki/CardBrowser.kt b/AnkiDroid/src/main/java/com/ichi2/anki/CardBrowser.kt
@@ -54,6 +54,7 @@ import com.ichi2.anki.CollectionManager.withCol
 import com.ichi2.anki.android.input.ShortcutGroup
 import com.ichi2.anki.android.input.shortcut
 import com.ichi2.anki.browser.BrowserColumnCollection
+import com.ichi2.anki.browser.BrowserColumnSelectionFragment
 import com.ichi2.anki.browser.BrowserMultiColumnAdapter
 import com.ichi2.anki.browser.BrowserRowCollection
 import com.ichi2.anki.browser.CardBrowserColumn.Companion.COLUMN2_KEYS
@@ -409,7 +410,15 @@ open class CardBrowser :
                 showFilteredDecks = true,
             )
 
-        this.browserColumnHeadings = findViewById<ViewGroup>(R.id.browser_column_headings)
+        this.browserColumnHeadings =
+            findViewById<ViewGroup>(R.id.browser_column_headings).apply {
+                setOnLongClickListener {
+                    Timber.d("long press on headings: opening column selection options")
+                    val dialog = BrowserColumnSelectionFragment()
+                    dialog.show(supportFragmentManager, "browserColumnsDialog")
+                    true
+                }
+            }
 
         startLoadingCollection()
 

diff --git a/AnkiDroid/src/main/java/com/ichi2/anki/dialogs/BrowserOptionsDialog.kt b/AnkiDroid/src/main/java/com/ichi2/anki/dialogs/BrowserOptionsDialog.kt
@@ -20,6 +20,7 @@ import android.app.Dialog
 import android.content.DialogInterface
 import android.os.Bundle
 import android.view.View
+import android.widget.Button
 import android.widget.CheckBox
 import android.widget.LinearLayout
 import android.widget.RadioButton
@@ -30,6 +31,7 @@ import androidx.core.os.bundleOf
 import androidx.fragment.app.activityViewModels
 import com.google.android.material.dialog.MaterialAlertDialogBuilder
 import com.ichi2.anki.R
+import com.ichi2.anki.browser.BrowserColumnSelectionFragment
 import com.ichi2.anki.browser.CardBrowserViewModel
 import com.ichi2.anki.model.CardsOrNotes
 import timber.log.Timber
@@ -92,6 +94,10 @@ class BrowserOptionsDialog : AppCompatDialogFragment() {
             dismiss()
         }
 
+        dialogView.findViewById<Button>(R.id.manage_columns_button).setOnClickListener {
+            openColumnManager()
+        }
+
         return MaterialAlertDialogBuilder(requireContext()).run {
             this.setView(dialogView)
             this.setTitle(getString(R.string.browser_options_dialog_heading))
@@ -103,6 +109,12 @@ class BrowserOptionsDialog : AppCompatDialogFragment() {
         }
     }
 
+    /** Opens [BrowserColumnSelectionFragment] for the current selection of [CardsOrNotes] */
+    private fun openColumnManager() {
+        val dialog = BrowserColumnSelectionFragment()
+        dialog.show(requireActivity().supportFragmentManager, "browserColumnsDialog")
+    }
+
     companion object {
         private const val CARDS_OR_NOTES_KEY = "cardsOrNotes"
         private const val IS_TRUNCATED_KEY = "isTruncated"

diff --git a/AnkiDroid/src/main/res/layout/browse_column_heading.xml b/AnkiDroid/src/main/res/layout/browse_column_heading.xml
@@ -18,7 +18,7 @@
     android:layout_width="0dp"
     android:layout_height="match_parent"
     android:layout_weight="1"
-    android:textFontWeight="500"
+    android:textFontWeight="700"
     android:paddingStart="4dp"
     android:textAppearance="@style/TextAppearance.AppCompat.Widget.TextView.SpinnerItem"
     android:layout_gravity="center_vertical"

diff --git a/AnkiDroid/src/main/res/layout/browser_options_dialog.xml b/AnkiDroid/src/main/res/layout/browser_options_dialog.xml
@@ -73,6 +73,34 @@
 
     </LinearLayout>
 
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        android:layout_margin="8dp">
+
+        <TextView
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:text="@string/browse_manage_columns_main_heading"
+            android:textStyle="bold"
+            android:layout_marginHorizontal="16dp" />
+
+        <!-- full width to increase touch target size on tablets -->
+        <com.google.android.material.button.MaterialButton
+            android:id="@+id/manage_columns_button"
+            style="@style/Widget.Material3.Button.TextButton"
+            android:layout_width="match_parent"
+            android:gravity="start|center_vertical"
+            android:layout_height="wrap_content"
+            android:textSize="@dimen/abc_text_size_button_material"
+            android:padding="0dp"
+            android:layout_marginHorizontal="16dp"
+            android:singleLine="true"
+            android:text="@string/browse_manage_columns" />
+
+    </LinearLayout>
+
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"

diff --git a/AnkiDroid/src/main/res/layout/card_browser.xml b/AnkiDroid/src/main/res/layout/card_browser.xml
@@ -17,10 +17,11 @@
         <LinearLayout
             android:id="@+id/browser_column_headings"
             android:layout_width="match_parent"
-            android:background="?android:attr/colorBackground"
+            android:background="?attr/selectableItemBackground"
             android:orientation="horizontal"
             android:paddingVertical="2dp"
-            android:layout_height="wrap_content">
+            android:layout_height="wrap_content"
+            android:longClickable="true">
 
         </LinearLayout>
 

diff --git a/AnkiDroid/src/main/res/values/07-cardbrowser.xml b/AnkiDroid/src/main/res/values/07-cardbrowser.xml
@@ -91,6 +91,7 @@
     <string name="show_order_dialog" comment="Description of the shortcut that shows the order dialog">Show order dialog</string>
 
     <!-- Manage columns dialog -->
+    <string name="browse_manage_columns_main_heading">Columns</string>
     <string name="browse_manage_columns">Manage columns</string>
     <string name="user_visible_columns">Displayed</string>
     <string name="user_potential_columns">Available</string>