From 1fa687f7ac938657433151c7002f0154fb8aedf9 Mon Sep 17 00:00:00 2001 From: arkon Date: Sun, 16 Jul 2023 09:58:52 -0400 Subject: [PATCH] Replace reader sheet dropdowns with chips (cherry picked from commit 22c6dbda3f55d864665228b43954b8decb5dda1f) # Conflicts: # app/src/main/java/eu/kanade/presentation/library/LibrarySettingsDialog.kt # app/src/main/java/eu/kanade/presentation/reader/settings/ReadingModePage.kt --- .../library/LibrarySettingsDialog.kt | 4 +- .../reader/settings/ColorFilterPage.kt | 4 +- .../reader/settings/GeneralSettingsPage.kt | 4 +- .../reader/settings/ReadingModePage.kt | 168 ++++++++++-------- .../core/components/SettingsItems.kt | 4 +- 5 files changed, 105 insertions(+), 79 deletions(-) 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 e25411b5b..e466e920a 100644 --- a/app/src/main/java/eu/kanade/presentation/library/LibrarySettingsDialog.kt +++ b/app/src/main/java/eu/kanade/presentation/library/LibrarySettingsDialog.kt @@ -33,7 +33,7 @@ import tachiyomi.domain.library.service.LibraryPreferences import tachiyomi.presentation.core.components.CheckboxItem import tachiyomi.presentation.core.components.HeadingItem import tachiyomi.presentation.core.components.IconItem -import tachiyomi.presentation.core.components.SettingsFlowRow +import tachiyomi.presentation.core.components.SettingsChipRow import tachiyomi.presentation.core.components.SliderItem import tachiyomi.presentation.core.components.SortItem import tachiyomi.presentation.core.components.TriStateItem @@ -227,7 +227,7 @@ private fun ColumnScope.DisplayPage( screenModel: LibrarySettingsScreenModel, ) { val displayMode by screenModel.libraryPreferences.libraryDisplayMode().collectAsState() - SettingsFlowRow(R.string.action_display_mode) { + SettingsChipRow(R.string.action_display_mode) { displayModes.map { (titleRes, mode) -> FilterChip( selected = displayMode == mode, diff --git a/app/src/main/java/eu/kanade/presentation/reader/settings/ColorFilterPage.kt b/app/src/main/java/eu/kanade/presentation/reader/settings/ColorFilterPage.kt index 0497986cf..94aa4fe9a 100644 --- a/app/src/main/java/eu/kanade/presentation/reader/settings/ColorFilterPage.kt +++ b/app/src/main/java/eu/kanade/presentation/reader/settings/ColorFilterPage.kt @@ -17,7 +17,7 @@ import eu.kanade.tachiyomi.ui.reader.setting.ReaderPreferences import eu.kanade.tachiyomi.ui.reader.setting.ReaderSettingsScreenModel import tachiyomi.core.preference.getAndSet import tachiyomi.presentation.core.components.CheckboxItem -import tachiyomi.presentation.core.components.SettingsFlowRow +import tachiyomi.presentation.core.components.SettingsChipRow import tachiyomi.presentation.core.components.SliderItem @Composable @@ -124,7 +124,7 @@ internal fun ColumnScope.ColorFilterPage(screenModel: ReaderSettingsScreenModel) ) val colorFilterMode by screenModel.preferences.colorFilterMode().collectAsState() - SettingsFlowRow(R.string.pref_color_filter_mode) { + SettingsChipRow(R.string.pref_color_filter_mode) { colorFilterModes.mapIndexed { index, it -> FilterChip( selected = colorFilterMode == index, diff --git a/app/src/main/java/eu/kanade/presentation/reader/settings/GeneralSettingsPage.kt b/app/src/main/java/eu/kanade/presentation/reader/settings/GeneralSettingsPage.kt index c740be9a4..9b16833a7 100644 --- a/app/src/main/java/eu/kanade/presentation/reader/settings/GeneralSettingsPage.kt +++ b/app/src/main/java/eu/kanade/presentation/reader/settings/GeneralSettingsPage.kt @@ -11,7 +11,7 @@ import eu.kanade.tachiyomi.R import eu.kanade.tachiyomi.ui.reader.setting.ReaderPreferences import eu.kanade.tachiyomi.ui.reader.setting.ReaderSettingsScreenModel import tachiyomi.presentation.core.components.CheckboxItem -import tachiyomi.presentation.core.components.SettingsFlowRow +import tachiyomi.presentation.core.components.SettingsChipRow private val themes = listOf( R.string.black_background to 1, @@ -23,7 +23,7 @@ private val themes = listOf( @Composable internal fun ColumnScope.GeneralPage(screenModel: ReaderSettingsScreenModel) { val readerTheme by screenModel.preferences.readerTheme().collectAsState() - SettingsFlowRow(R.string.pref_reader_theme) { + SettingsChipRow(R.string.pref_reader_theme) { themes.map { (labelRes, value) -> FilterChip( selected = readerTheme == value, diff --git a/app/src/main/java/eu/kanade/presentation/reader/settings/ReadingModePage.kt b/app/src/main/java/eu/kanade/presentation/reader/settings/ReadingModePage.kt index 60300a5e4..5303dcad9 100644 --- a/app/src/main/java/eu/kanade/presentation/reader/settings/ReadingModePage.kt +++ b/app/src/main/java/eu/kanade/presentation/reader/settings/ReadingModePage.kt @@ -1,6 +1,8 @@ package eu.kanade.presentation.reader.settings import androidx.compose.foundation.layout.ColumnScope +import androidx.compose.material3.FilterChip +import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.collectAsState import androidx.compose.runtime.getValue @@ -18,7 +20,7 @@ import eu.kanade.tachiyomi.ui.reader.viewer.webtoon.WebtoonViewer import eu.kanade.tachiyomi.util.system.isReleaseBuildType import tachiyomi.presentation.core.components.CheckboxItem import tachiyomi.presentation.core.components.HeadingItem -import tachiyomi.presentation.core.components.SelectItem +import tachiyomi.presentation.core.components.SettingsChipRow import tachiyomi.presentation.core.components.SliderItem import java.text.NumberFormat @@ -32,21 +34,25 @@ internal fun ColumnScope.ReadingModePage(screenModel: ReaderSettingsScreenModel) val manga by screenModel.mangaFlow.collectAsState() val readingMode = remember(manga) { ReadingModeType.fromPreference(manga?.readingModeType?.toInt()) } - SelectItem( - label = stringResource(R.string.pref_category_reading_mode), - options = readingModeOptions.map { stringResource(it.first) }.toTypedArray(), - selectedIndex = readingModeOptions.indexOfFirst { it.second == readingMode }, - ) { - screenModel.onChangeReadingMode(readingModeOptions[it].second) + SettingsChipRow(R.string.pref_category_reading_mode) { + readingModeOptions.map { (stringRes, it) -> + FilterChip( + selected = it == readingMode, + onClick = { screenModel.onChangeReadingMode(it) }, + label = { Text(stringResource(stringRes)) }, + ) + } } val orientationType = remember(manga) { OrientationType.fromPreference(manga?.orientationType?.toInt()) } - SelectItem( - label = stringResource(R.string.rotation_type), - options = orientationTypeOptions.map { stringResource(it.first) }.toTypedArray(), - selectedIndex = orientationTypeOptions.indexOfFirst { it.second == orientationType }, - ) { - screenModel.onChangeOrientation(orientationTypeOptions[it].second) + SettingsChipRow(R.string.rotation_type) { + orientationTypeOptions.map { (stringRes, it) -> + FilterChip( + selected = it == orientationType, + onClick = { screenModel.onChangeOrientation(it) }, + label = { Text(stringResource(stringRes)) }, + ) + } } val viewer by screenModel.viewerFlow.collectAsState() @@ -65,49 +71,47 @@ private fun ColumnScope.PagerViewerSettings(screenModel: ReaderSettingsScreenMod HeadingItem(R.string.pager_viewer) val navigationModePager by screenModel.preferences.navigationModePager().collectAsState() - SelectItem( - label = stringResource(R.string.pref_viewer_nav), - options = ReaderPreferences.TapZones.map { stringResource(it) }.toTypedArray(), - selectedIndex = navigationModePager, - onSelect = { screenModel.preferences.navigationModePager().set(it) }, + val pagerNavInverted by screenModel.preferences.pagerNavInverted().collectAsState() + TapZonesItems( + selected = navigationModePager, + onSelect = screenModel.preferences.navigationModePager()::set, + invertMode = pagerNavInverted, + onSelectInvertMode = screenModel.preferences.pagerNavInverted()::set, ) - if (navigationModePager != 5) { - val pagerNavInverted by screenModel.preferences.pagerNavInverted().collectAsState() - SelectItem( - label = stringResource(R.string.pref_read_with_tapping_inverted), - options = tappingInvertModeOptions.map { stringResource(it.first) }.toTypedArray(), - selectedIndex = tappingInvertModeOptions.indexOfFirst { it.second == pagerNavInverted }, - onSelect = { - screenModel.preferences.pagerNavInverted().set(tappingInvertModeOptions[it].second) - }, - ) - } - val imageScaleType by screenModel.preferences.imageScaleType().collectAsState() - SelectItem( - label = stringResource(R.string.pref_image_scale_type), - options = ReaderPreferences.ImageScaleType.map { stringResource(it) }.toTypedArray(), - selectedIndex = imageScaleType - 1, - onSelect = { screenModel.preferences.imageScaleType().set(it + 1) }, - ) + SettingsChipRow(R.string.pref_image_scale_type) { + ReaderPreferences.ImageScaleType.mapIndexed { index, it -> + FilterChip( + selected = imageScaleType == index + 1, + onClick = { screenModel.preferences.imageScaleType().set(index + 1) }, + label = { Text(stringResource(it)) }, + ) + } + } val zoomStart by screenModel.preferences.zoomStart().collectAsState() - SelectItem( - label = stringResource(R.string.pref_zoom_start), - options = ReaderPreferences.ZoomStart.map { stringResource(it) }.toTypedArray(), - selectedIndex = zoomStart - 1, - onSelect = { screenModel.preferences.zoomStart().set(it + 1) }, - ) + SettingsChipRow(R.string.pref_zoom_start) { + ReaderPreferences.ZoomStart.mapIndexed { index, it -> + FilterChip( + selected = zoomStart == index + 1, + onClick = { screenModel.preferences.zoomStart().set(index + 1) }, + label = { Text(stringResource(it)) }, + ) + } + } // SY --> val pageLayout by screenModel.preferences.pageLayout().collectAsState() - SelectItem( - label = stringResource(R.string.page_layout), - options = ReaderPreferences.PageLayouts.map { stringResource(it) }.toTypedArray(), - selectedIndex = pageLayout, - onSelect = { screenModel.preferences.pageLayout().set(it) }, - ) + SettingsChipRow(R.string.page_layout) { + ReaderPreferences.PageLayouts.mapIndexed { index, it -> + FilterChip( + selected = pageLayout == index, + onClick = { screenModel.preferences.pageLayout().set(index) }, + label = { Text(stringResource(it)) }, + ) + } + } // SY <-- val cropBorders by screenModel.preferences.cropBorders().collectAsState() @@ -197,12 +201,15 @@ private fun ColumnScope.PagerViewerSettings(screenModel: ReaderSettingsScreenMod ) val centerMarginType by screenModel.preferences.centerMarginType().collectAsState() - SelectItem( - label = stringResource(R.string.pref_center_margin), - options = ReaderPreferences.CenterMarginTypes.map { stringResource(it) }.toTypedArray(), - selectedIndex = centerMarginType, - onSelect = { screenModel.preferences.centerMarginType().set(it) }, - ) + SettingsChipRow(R.string.pref_center_margin) { + ReaderPreferences.CenterMarginTypes.mapIndexed { index, it -> + FilterChip( + selected = centerMarginType == index, + onClick = { screenModel.preferences.centerMarginType().set(index) }, + label = { Text(stringResource(it)) }, + ) + } + } // SY <-- } @@ -213,25 +220,14 @@ private fun ColumnScope.WebtoonViewerSettings(screenModel: ReaderSettingsScreenM HeadingItem(R.string.webtoon_viewer) val navigationModeWebtoon by screenModel.preferences.navigationModeWebtoon().collectAsState() - SelectItem( - label = stringResource(R.string.pref_viewer_nav), - options = ReaderPreferences.TapZones.map { stringResource(it) }.toTypedArray(), - selectedIndex = navigationModeWebtoon, - onSelect = { screenModel.preferences.navigationModeWebtoon().set(it) }, + val webtoonNavInverted by screenModel.preferences.webtoonNavInverted().collectAsState() + TapZonesItems( + selected = navigationModeWebtoon, + onSelect = screenModel.preferences.navigationModeWebtoon()::set, + invertMode = webtoonNavInverted, + onSelectInvertMode = screenModel.preferences.webtoonNavInverted()::set, ) - if (navigationModeWebtoon != 5) { - val webtoonNavInverted by screenModel.preferences.webtoonNavInverted().collectAsState() - SelectItem( - label = stringResource(R.string.pref_read_with_tapping_inverted), - options = tappingInvertModeOptions.map { stringResource(it.first) }.toTypedArray(), - selectedIndex = tappingInvertModeOptions.indexOfFirst { it.second == webtoonNavInverted }, - onSelect = { - screenModel.preferences.webtoonNavInverted().set(tappingInvertModeOptions[it].second) - }, - ) - } - val webtoonSidePadding by screenModel.preferences.webtoonSidePadding().collectAsState() SliderItem( label = stringResource(R.string.pref_webtoon_side_padding), @@ -340,3 +336,33 @@ private fun ColumnScope.WebtoonWithGapsViewerSettings(screenModel: ReaderSetting ) } // SY <-- + +@Composable +private fun ColumnScope.TapZonesItems( + selected: Int, + onSelect: (Int) -> Unit, + invertMode: ReaderPreferences.TappingInvertMode, + onSelectInvertMode: (ReaderPreferences.TappingInvertMode) -> Unit, +) { + SettingsChipRow(R.string.pref_viewer_nav) { + ReaderPreferences.TapZones.mapIndexed { index, it -> + FilterChip( + selected = selected == index, + onClick = { onSelect(index) }, + label = { Text(stringResource(it)) }, + ) + } + } + + if (selected != 5) { + SettingsChipRow(R.string.pref_read_with_tapping_inverted) { + tappingInvertModeOptions.map { (stringRes, mode) -> + FilterChip( + selected = mode == invertMode, + onClick = { onSelectInvertMode(mode) }, + label = { Text(stringResource(stringRes)) }, + ) + } + } + } +} diff --git a/presentation-core/src/main/java/tachiyomi/presentation/core/components/SettingsItems.kt b/presentation-core/src/main/java/tachiyomi/presentation/core/components/SettingsItems.kt index 6f6d2ebac..9b198e68d 100644 --- a/presentation-core/src/main/java/tachiyomi/presentation/core/components/SettingsItems.kt +++ b/presentation-core/src/main/java/tachiyomi/presentation/core/components/SettingsItems.kt @@ -230,7 +230,7 @@ fun SelectItem( ) ExposedDropdownMenu( - modifier = Modifier.exposedDropdownSize(matchTextFieldWidth = true), + modifier = Modifier.exposedDropdownSize(), expanded = expanded, onDismissRequest = { expanded = false }, ) { @@ -345,7 +345,7 @@ fun IconItem( // SY <-- @Composable -fun SettingsFlowRow( +fun SettingsChipRow( @StringRes labelRes: Int, content: @Composable FlowRowScope.() -> Unit, ) {