diff --git a/app/src/main/java/eu/kanade/presentation/library/LibraryColumnsDialog.kt b/app/src/main/java/eu/kanade/presentation/library/LibraryColumnsDialog.kt
deleted file mode 100644
index f3ad0827e..000000000
--- a/app/src/main/java/eu/kanade/presentation/library/LibraryColumnsDialog.kt
+++ /dev/null
@@ -1,126 +0,0 @@
-package eu.kanade.presentation.library
-
-import androidx.compose.foundation.layout.BoxWithConstraints
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.material3.AlertDialog
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Text
-import androidx.compose.material3.TextButton
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.ReadOnlyComposable
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.saveable.rememberSaveable
-import androidx.compose.runtime.setValue
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.DpSize
-import androidx.compose.ui.unit.dp
-import eu.kanade.tachiyomi.R
-import tachiyomi.presentation.core.components.WheelPickerDefaults
-import tachiyomi.presentation.core.components.WheelTextPicker
-
-@Composable
-fun LibraryColumnsDialog(
- initialPortrait: Int,
- initialLandscape: Int,
- onDismissRequest: () -> Unit,
- onValueChanged: (portrait: Int, landscape: Int) -> Unit,
-) {
- var portraitValue by rememberSaveable { mutableStateOf(initialPortrait) }
- var landscapeValue by rememberSaveable { mutableStateOf(initialLandscape) }
-
- AlertDialog(
- onDismissRequest = onDismissRequest,
- title = { Text(text = stringResource(R.string.pref_library_columns)) },
- text = {
- Column {
- Row {
- Text(
- modifier = Modifier.weight(1f),
- text = stringResource(R.string.portrait),
- textAlign = TextAlign.Center,
- maxLines = 1,
- style = MaterialTheme.typography.labelMedium,
- )
- Text(
- modifier = Modifier.weight(1f),
- text = stringResource(R.string.landscape),
- textAlign = TextAlign.Center,
- maxLines = 1,
- style = MaterialTheme.typography.labelMedium,
- )
- }
- LibraryColumnsPicker(
- modifier = Modifier.fillMaxWidth(),
- portraitValue = portraitValue,
- onPortraitChange = { portraitValue = it },
- landscapeValue = landscapeValue,
- onLandscapeChange = { landscapeValue = it },
- )
- }
- },
- dismissButton = {
- TextButton(onClick = onDismissRequest) {
- Text(text = stringResource(R.string.action_cancel))
- }
- },
- confirmButton = {
- TextButton(
- enabled = portraitValue != initialPortrait || landscapeValue != initialLandscape,
- onClick = { onValueChanged(portraitValue, landscapeValue) },
- ) {
- Text(text = stringResource(android.R.string.ok))
- }
- },
- )
-}
-
-@Composable
-private fun LibraryColumnsPicker(
- modifier: Modifier = Modifier,
- portraitValue: Int,
- onPortraitChange: (Int) -> Unit,
- landscapeValue: Int,
- onLandscapeChange: (Int) -> Unit,
-) {
- BoxWithConstraints(
- modifier = modifier,
- contentAlignment = Alignment.Center,
- ) {
- WheelPickerDefaults.Background(size = DpSize(maxWidth, 128.dp))
-
- val size = DpSize(width = maxWidth / 2, height = 128.dp)
- Row {
- val columns = (0..10).map { getColumnValue(value = it) }
- WheelTextPicker(
- startIndex = portraitValue,
- items = columns,
- size = size,
- onSelectionChanged = onPortraitChange,
- backgroundContent = null,
- )
- WheelTextPicker(
- startIndex = landscapeValue,
- items = columns,
- size = size,
- onSelectionChanged = onLandscapeChange,
- backgroundContent = null,
- )
- }
- }
-}
-
-@Composable
-@ReadOnlyComposable
-private fun getColumnValue(value: Int): String {
- return if (value == 0) {
- stringResource(R.string.label_default)
- } else {
- value.toString()
- }
-}
diff --git a/app/src/main/java/eu/kanade/presentation/library/LibrarySettingsDialog.kt b/app/src/main/java/eu/kanade/presentation/library/LibrarySettingsDialog.kt
index 94399faf0..35db5758a 100644
--- a/app/src/main/java/eu/kanade/presentation/library/LibrarySettingsDialog.kt
+++ b/app/src/main/java/eu/kanade/presentation/library/LibrarySettingsDialog.kt
@@ -1,25 +1,34 @@
package eu.kanade.presentation.library
+import android.content.res.Configuration
+import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Apps
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Slider
+import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
+import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalConfiguration
import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
import eu.kanade.presentation.components.TabbedDialog
import eu.kanade.presentation.components.TabbedDialogPaddings
import eu.kanade.presentation.components.TriStateItem
import eu.kanade.presentation.util.collectAsState
import eu.kanade.tachiyomi.R
import eu.kanade.tachiyomi.ui.library.LibrarySettingsScreenModel
+import kotlinx.coroutines.flow.map
import tachiyomi.domain.category.model.Category
import tachiyomi.domain.library.model.LibraryDisplayMode
import tachiyomi.domain.library.model.LibrarySort
@@ -29,8 +38,8 @@ import tachiyomi.domain.library.service.LibraryPreferences
import tachiyomi.domain.manga.model.TriStateFilter
import tachiyomi.presentation.core.components.CheckboxItem
import tachiyomi.presentation.core.components.HeadingItem
-import tachiyomi.presentation.core.components.IconItem
import tachiyomi.presentation.core.components.RadioItem
+import tachiyomi.presentation.core.components.SettingsItemsPaddings
import tachiyomi.presentation.core.components.SortItem
@Composable
@@ -176,23 +185,6 @@ private fun ColumnScope.DisplayPage(
category: Category,
screenModel: LibrarySettingsScreenModel,
) {
- val portraitColumns by screenModel.libraryPreferences.portraitColumns().collectAsState()
- val landscapeColumns by screenModel.libraryPreferences.landscapeColumns().collectAsState()
-
- var showColumnsDialog by rememberSaveable { mutableStateOf(false) }
- if (showColumnsDialog) {
- LibraryColumnsDialog(
- initialPortrait = portraitColumns,
- initialLandscape = landscapeColumns,
- onDismissRequest = { showColumnsDialog = false },
- onValueChanged = { portrait, landscape ->
- screenModel.libraryPreferences.portraitColumns().set(portrait)
- screenModel.libraryPreferences.landscapeColumns().set(landscape)
- showColumnsDialog = false
- },
- )
- }
-
HeadingItem(R.string.action_display_mode)
listOf(
R.string.action_display_grid to LibraryDisplayMode.CompactGrid,
@@ -208,11 +200,46 @@ private fun ColumnScope.DisplayPage(
}
if (category.display != LibraryDisplayMode.List) {
- IconItem(
- label = stringResource(R.string.pref_library_columns),
- icon = Icons.Outlined.Apps,
- onClick = { showColumnsDialog = true },
- )
+ Row(
+ modifier = Modifier
+ .fillMaxWidth()
+ .padding(
+ horizontal = SettingsItemsPaddings.Horizontal,
+ vertical = SettingsItemsPaddings.Vertical,
+ ),
+ verticalAlignment = Alignment.CenterVertically,
+ horizontalArrangement = Arrangement.spacedBy(24.dp),
+ ) {
+ val configuration = LocalConfiguration.current
+ val columnPreference = remember {
+ if (configuration.orientation == Configuration.ORIENTATION_LANDSCAPE) {
+ screenModel.libraryPreferences.landscapeColumns()
+ } else {
+ screenModel.libraryPreferences.portraitColumns()
+ }
+ }
+
+ val columns by columnPreference.changes().collectAsState(initial = 0)
+ Column {
+ Text(
+ stringResource(id = R.string.pref_library_columns),
+ style = MaterialTheme.typography.bodyMedium,
+ )
+ if (columns > 0) {
+ Text(stringResource(id = R.string.pref_library_columns_per_row, columns))
+ } else {
+ Text(stringResource(id = R.string.label_default))
+ }
+ }
+
+ Slider(
+ value = columns.toFloat(),
+ onValueChange = { columnPreference.set(it.toInt()) },
+ modifier = Modifier.weight(1f),
+ valueRange = 0f..10f,
+ steps = 10,
+ )
+ }
}
HeadingItem(R.string.overlay_header)
diff --git a/i18n/src/main/res/values/strings.xml b/i18n/src/main/res/values/strings.xml
index 66e60d342..c3c468062 100644
--- a/i18n/src/main/res/values/strings.xml
+++ b/i18n/src/main/res/values/strings.xml
@@ -230,7 +230,8 @@
Display
- Items per row
+ Grid size
+ %d per row
Portrait
Landscape