Use Slider instead of Seekbar for grid per row

app/src/main/java/eu/kanade/tachiyomi/ui/library/display/LibraryDisplayView.kt

@@ -1,17 +1,13 @@
 package eu.kanade.tachiyomi.ui.library.display
 
-import android.animation.ValueAnimator
 import android.content.Context
 import android.util.AttributeSet
 import android.view.View
-import android.view.ViewTreeObserver
-import android.widget.SeekBar
-import androidx.core.animation.addListener
-import androidx.core.view.isVisible
 import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
 import com.afollestad.materialdialogs.MaterialDialog
 import com.afollestad.materialdialogs.customview.customView
+import com.google.android.material.slider.Slider
 import eu.davidea.flexibleadapter.FlexibleAdapter
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.databinding.LibraryDisplayLayoutBinding
@@ -19,10 +15,9 @@ import eu.kanade.tachiyomi.ui.library.filter.FilterBottomSheet
 import eu.kanade.tachiyomi.ui.library.filter.ManageFilterItem
 import eu.kanade.tachiyomi.util.bindToPreference
 import eu.kanade.tachiyomi.util.lang.withSubtitle
-import eu.kanade.tachiyomi.util.system.dpToPx
+import eu.kanade.tachiyomi.util.view.checkHeightThen
 import eu.kanade.tachiyomi.util.view.rowsForValue
 import eu.kanade.tachiyomi.widget.BaseLibraryDisplayView
-import eu.kanade.tachiyomi.widget.EndAnimatorListener
 import kotlin.math.roundToInt
 
 class LibraryDisplayView @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null) :
@@ -33,9 +28,10 @@ class LibraryDisplayView @JvmOverloads constructor(context: Context, attrs: Attr
     override fun initGeneralPreferences() {
         binding.displayGroup.bindToPreference(preferences.libraryLayout())
         binding.uniformGrid.bindToPreference(preferences.uniformGrid())
-        binding.gridSeekbar.progress = ((preferences.gridSize().get() + .5f) * 2f).roundToInt()
+        binding.gridSeekbar.value = ((preferences.gridSize().get() + .5f) * 2f).roundToInt().toFloat()
+        binding.gridSeekbar.isTickVisible = false
         binding.resetGridSize.setOnClickListener {
-            binding.gridSeekbar.progress = 3
+            binding.gridSeekbar.value = 3f
         }
 
         binding.reorderFiltersButton.setOnClickListener {
@@ -67,67 +63,33 @@ class LibraryDisplayView @JvmOverloads constructor(context: Context, attrs: Attr
                 .show()
         }
 
-        binding.root.viewTreeObserver.addOnGlobalLayoutListener(object : ViewTreeObserver.OnGlobalLayoutListener {
-            override fun onGlobalLayout() {
-                if (binding.root.width > 0) {
-                    setGridText(binding.gridSeekbar.progress)
-                    binding.root.viewTreeObserver.removeOnGlobalLayoutListener(this)
-                }
-            }
-        })
-        binding.gridSeekbar.setOnSeekBarChangeListener(object : SeekBar.OnSeekBarChangeListener {
-            override fun onProgressChanged(seekBar: SeekBar?, progress: Int, fromUser: Boolean) {
-                if (seekBar != null && fromUser) {
-                    alpha = 1f
-                    isVisible = true
-                    adjustSeekBarTip(seekBar, progress)
-                }
-                if (!fromUser) {
-                    preferences.gridSize().set((progress / 2f) - .5f)
-                }
-                setGridText(progress)
+        binding.gridSeekbar.setLabelFormatter {
+            (mainView ?: this@LibraryDisplayView).rowsForValue(it).toString()
+        }
+        binding.gridSeekbar.addOnChangeListener { _, value, fromUser ->
+            if (!fromUser) {
+                preferences.gridSize().set((value / 2f) - .5f)
             }
+            setGridText(value)
+        }
+        binding.gridSeekbar.addOnSliderTouchListener(object : Slider.OnSliderTouchListener {
+            override fun onStartTrackingTouch(slider: Slider) {}
 
-            override fun onStartTrackingTouch(seekBar: SeekBar?) {
-                with(binding.seekBarTextView.root) {
-                    alpha = 0f
-                    isVisible = true
-                    animate().alpha(1f).setDuration(250L).start()
-                    seekBar?.post {
-                        adjustSeekBarTip(seekBar, seekBar.progress)
-                    }
-                }
-            }
-
-            override fun onStopTrackingTouch(seekBar: SeekBar?) {
-                preferences.gridSize().set(((seekBar?.progress ?: 2) / 2f) - .5f)
-                with(binding.seekBarTextView.root) {
-                    isVisible = true
-                    alpha = 1f
-                    post {
-                        val anim =
-                            ValueAnimator.ofFloat(
-                                1f,
-                                0f
-                            ) // animate().alpha(0f).setDuration(250L)
-                        anim.duration = 250
-                        anim.startDelay = 500
-                        anim.addUpdateListener {
-                            alpha = it.animatedValue as Float
-                        }
-                        anim.addListener {
-                            EndAnimatorListener {
-                                isVisible = false
-                            }
-                        }
-                        anim.start()
-                    }
-                }
+            override fun onStopTrackingTouch(slider: Slider) {
+                preferences.gridSize().set((slider.value / 2f) - .5f)
+                setGridText(slider.value)
             }
         })
     }
 
-    private fun setGridText(progress: Int) {
+    override fun onFinishInflate() {
+        super.onFinishInflate()
+        checkHeightThen {
+            setGridText(binding.gridSeekbar.value)
+        }
+    }
+
+    private fun setGridText(progress: Float) {
         with(binding.gridSizeText) {
             val rows = (mainView ?: this@LibraryDisplayView).rowsForValue(progress)
             val titleText = context.getString(R.string.grid_size)
@@ -135,14 +97,4 @@ class LibraryDisplayView @JvmOverloads constructor(context: Context, attrs: Attr
             text = titleText.withSubtitle(context, subtitleText)
         }
     }
-
-    private fun adjustSeekBarTip(seekBar: SeekBar, progress: Int) {
-        with(binding.seekBarTextView.root) {
-            val value =
-                (progress * (seekBar.width - 12.dpToPx - 2 * seekBar.thumbOffset)) / seekBar.max
-            text = (mainView ?: this@LibraryDisplayView).rowsForValue(progress).toString()
-            x = seekBar.x + value + seekBar.thumbOffset / 2 + 5.dpToPx
-            y = seekBar.y + binding.gridSizeLayout.y - 6.dpToPx - height
-        }
-    }
 }

app/src/main/java/eu/kanade/tachiyomi/util/view/ViewExtensions.kt

@@ -343,11 +343,11 @@ fun RecyclerView.smoothScrollToTop() {
     }
 }
 
-fun View.rowsForValue(value: Int): Int {
-    return rowsForValue((value / 2f) - .5f)
+fun View.rowsForValue(value: Float): Int {
+    return trueRowsForValue((value / 2f) - .5f)
 }
 
-fun View.rowsForValue(value: Float): Int {
+private fun View.trueRowsForValue(value: Float): Int {
     val size = 1.5f.pow(value)
     val trueSize = AutofitRecyclerView.MULTIPLE * ((size * 100 / AutofitRecyclerView.MULTIPLE).roundToInt()) / 100f
     val dpWidth = (measuredWidth.pxToDp / 100f).roundToInt()

app/src/main/res/layout/library_display_layout.xml

@@ -64,19 +64,24 @@
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"/>
 
-                <SeekBar
+                <com.google.android.material.slider.Slider
                     android:id="@+id/grid_seekbar"
+                    style="@style/Theme.Widget.Slider"
+                    android:layout_height="wrap_content"
+                    android:layout_width="0dp"
                     android:layout_marginStart="12dp"
                     android:paddingTop="6dp"
                     android:paddingBottom="6dp"
-                    android:max="7"
-                    android:layout_width="0dp"
+                    android:valueFrom="0"
+                    android:valueTo="7"
+                    tools:value="3"
+                    android:stepSize="1"
+                    app:tickVisible="false"
                     app:layout_constraintStart_toEndOf="@id/grid_size_text"
                     app:layout_constraintTop_toTopOf="parent"
                     app:layout_constraintBottom_toBottomOf="parent"
                     app:layout_constraintEnd_toStartOf="@id/reset_grid_size"
-                    app:layout_constraintWidth_max="350dp"
-                    android:layout_height="wrap_content"/>
+                    app:layout_constraintWidth_max="350dp" />
 
                 <com.google.android.material.button.MaterialButton
                     android:id="@+id/reset_grid_size"
@@ -111,13 +116,5 @@
                 app:iconTint="?android:attr/textColorPrimary"
                 android:text="@string/reorder_filters" />
         </LinearLayout>
-
-        <include
-            android:id="@+id/seek_bar_text_view"
-            android:visibility="gone"
-            android:alpha="0"
-            tools:alpha="1"
-            tools:visibility="visible"
-            layout="@layout/tooltip_text_view"/>
     </FrameLayout>
 </eu.kanade.tachiyomi.ui.library.display.LibraryDisplayView>

app/src/main/res/values/styles.xml

@@ -242,6 +242,26 @@
         <item name="tabIndicatorFullWidth">true</item>
     </style>
 
+    <style name="Theme.Widget.Slider" parent="Widget.MaterialComponents.Slider">
+        <item name="trackColorInactive">@color/accent_alpha</item>
+        <item name="trackColorActive">?colorAccent</item>
+        <item name="thumbColor">?colorAccent</item>
+        <item name="labelStyle">@style/Theme.Widget.Tooltip</item>
+        <item name="tickColorActive">?colorOnAccent</item>
+        <item name="tickColorInactive">?android:textColorSecondary</item>
+        <item name="haloColor">?colorControlHighlight</item>
+    </style>
+
+
+    <style name="Theme.Widget.Tooltip" parent="Widget.MaterialComponents.Tooltip">
+        <item name="backgroundTint">?colorAccent</item>
+        <item name="android:textAppearance">@style/Theme.TextAppearance.Tooltip</item>
+    </style>
+
+    <style name="Theme.TextAppearance.Tooltip" parent="@style/TextAppearance.MaterialComponents.Tooltip">
+        <item name="android:textColor">?colorOnAccent</item>
+    </style>
+
     <!--==============-->
     <!--Widgets.Button-->
     <!--==============-->