BrowseSourceScreen: Adjust browse mode chips placement (#8076)

The chips row is now scrollable too and filter fab is removed
This commit is contained in:
Ivan Iskandar 2022-09-25 21:15:01 +07:00 committed by GitHub
parent ba533f30ce
commit 0190c36d20
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 40 additions and 62 deletions

View File

@ -1,13 +1,17 @@
package eu.kanade.presentation.browse package eu.kanade.presentation.browse
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.background
import androidx.compose.foundation.horizontalScroll
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.navigationBarsPadding import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.grid.GridCells import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.rememberScrollState
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.Favorite import androidx.compose.material.icons.outlined.Favorite
import androidx.compose.material.icons.outlined.FilterList import androidx.compose.material.icons.outlined.FilterList
@ -15,6 +19,7 @@ import androidx.compose.material.icons.outlined.NewReleases
import androidx.compose.material3.FilterChip import androidx.compose.material3.FilterChip
import androidx.compose.material3.FilterChipDefaults import androidx.compose.material3.FilterChipDefaults
import androidx.compose.material3.Icon import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.SnackbarDuration import androidx.compose.material3.SnackbarDuration
import androidx.compose.material3.SnackbarHost import androidx.compose.material3.SnackbarHost
import androidx.compose.material3.SnackbarHostState import androidx.compose.material3.SnackbarHostState
@ -42,6 +47,7 @@ import eu.kanade.presentation.browse.components.BrowseSourceCompactGrid
import eu.kanade.presentation.browse.components.BrowseSourceList import eu.kanade.presentation.browse.components.BrowseSourceList
import eu.kanade.presentation.browse.components.BrowseSourceToolbar import eu.kanade.presentation.browse.components.BrowseSourceToolbar
import eu.kanade.presentation.components.AppStateBanners import eu.kanade.presentation.components.AppStateBanners
import eu.kanade.presentation.components.Divider
import eu.kanade.presentation.components.EmptyScreen import eu.kanade.presentation.components.EmptyScreen
import eu.kanade.presentation.components.ExtendedFloatingActionButton import eu.kanade.presentation.components.ExtendedFloatingActionButton
import eu.kanade.presentation.components.LoadingScreen import eu.kanade.presentation.components.LoadingScreen
@ -56,7 +62,7 @@ import eu.kanade.tachiyomi.widget.EmptyView
fun BrowseSourceScreen( fun BrowseSourceScreen(
presenter: BrowseSourcePresenter, presenter: BrowseSourcePresenter,
navigateUp: () -> Unit, navigateUp: () -> Unit,
onFabClick: () -> Unit, openFilterSheet: () -> Unit,
onMangaClick: (Manga) -> Unit, onMangaClick: (Manga) -> Unit,
onMangaLongClick: (Manga) -> Unit, onMangaLongClick: (Manga) -> Unit,
onWebViewClick: () -> Unit, onWebViewClick: () -> Unit,
@ -76,8 +82,8 @@ fun BrowseSourceScreen(
} }
Scaffold( Scaffold(
topBar = { scrollBehavior -> topBar = {
Column { Column(modifier = Modifier.background(MaterialTheme.colorScheme.surface)) {
BrowseSourceToolbar( BrowseSourceToolbar(
state = presenter, state = presenter,
source = presenter.source!!, source = presenter.source!!,
@ -87,37 +93,12 @@ fun BrowseSourceScreen(
onWebViewClick = onWebViewClick, onWebViewClick = onWebViewClick,
onHelpClick = onHelpClick, onHelpClick = onHelpClick,
onSearch = { presenter.search() }, onSearch = { presenter.search() },
scrollBehavior = scrollBehavior,
) )
AppStateBanners(downloadedOnlyMode, incognitoMode)
}
},
floatingActionButton = {
BrowseSourceFloatingActionButton(
isVisible = presenter.filters.isNotEmpty() && presenter.currentFilter is BrowseSourcePresenter.Filter.UserInput,
onFabClick = onFabClick,
)
},
snackbarHost = {
SnackbarHost(hostState = snackbarHostState)
},
) { paddingValues ->
BrowseSourceContent(
state = presenter,
mangaList = mangaList,
getMangaState = { presenter.getManga(it) },
columns = columns,
displayMode = presenter.displayMode,
snackbarHostState = snackbarHostState,
contentPadding = paddingValues,
onWebViewClick = onWebViewClick,
onHelpClick = { uriHandler.openUri(MoreController.URL_HELP) },
onLocalSourceHelpClick = onHelpClick,
onMangaClick = onMangaClick,
onMangaLongClick = onMangaLongClick,
header = {
Row( Row(
modifier = Modifier
.horizontalScroll(rememberScrollState())
.padding(horizontal = 8.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp), horizontalArrangement = Arrangement.spacedBy(8.dp),
) { ) {
FilterChip( FilterChip(
@ -161,7 +142,7 @@ fun BrowseSourceScreen(
if (presenter.filters.isNotEmpty()) { if (presenter.filters.isNotEmpty()) {
FilterChip( FilterChip(
selected = presenter.currentFilter is BrowseSourcePresenter.Filter.UserInput, selected = presenter.currentFilter is BrowseSourcePresenter.Filter.UserInput,
onClick = onFabClick, onClick = openFilterSheet,
leadingIcon = { leadingIcon = {
Icon( Icon(
imageVector = Icons.Outlined.FilterList, imageVector = Icons.Outlined.FilterList,
@ -176,7 +157,29 @@ fun BrowseSourceScreen(
) )
} }
} }
},
Divider()
AppStateBanners(downloadedOnlyMode, incognitoMode)
}
},
snackbarHost = {
SnackbarHost(hostState = snackbarHostState)
},
) { paddingValues ->
BrowseSourceContent(
state = presenter,
mangaList = mangaList,
getMangaState = { presenter.getManga(it) },
columns = columns,
displayMode = presenter.displayMode,
snackbarHostState = snackbarHostState,
contentPadding = paddingValues,
onWebViewClick = onWebViewClick,
onHelpClick = { uriHandler.openUri(MoreController.URL_HELP) },
onLocalSourceHelpClick = onHelpClick,
onMangaClick = onMangaClick,
onMangaLongClick = onMangaLongClick,
) )
} }
} }
@ -202,7 +205,6 @@ fun BrowseSourceContent(
state: BrowseSourceState, state: BrowseSourceState,
mangaList: LazyPagingItems<Manga>, mangaList: LazyPagingItems<Manga>,
getMangaState: @Composable ((Manga) -> State<Manga>), getMangaState: @Composable ((Manga) -> State<Manga>),
header: (@Composable () -> Unit)? = null,
columns: GridCells, columns: GridCells,
displayMode: LibraryDisplayMode, displayMode: LibraryDisplayMode,
snackbarHostState: SnackbarHostState, snackbarHostState: SnackbarHostState,
@ -274,7 +276,6 @@ fun BrowseSourceContent(
contentPadding = contentPadding, contentPadding = contentPadding,
onMangaClick = onMangaClick, onMangaClick = onMangaClick,
onMangaLongClick = onMangaLongClick, onMangaLongClick = onMangaLongClick,
header = header,
) )
} }
LibraryDisplayMode.List -> { LibraryDisplayMode.List -> {
@ -284,7 +285,6 @@ fun BrowseSourceContent(
contentPadding = contentPadding, contentPadding = contentPadding,
onMangaClick = onMangaClick, onMangaClick = onMangaClick,
onMangaLongClick = onMangaLongClick, onMangaLongClick = onMangaLongClick,
header = header,
) )
} }
else -> { else -> {
@ -295,7 +295,6 @@ fun BrowseSourceContent(
contentPadding = contentPadding, contentPadding = contentPadding,
onMangaClick = onMangaClick, onMangaClick = onMangaClick,
onMangaLongClick = onMangaLongClick, onMangaLongClick = onMangaLongClick,
header = header,
) )
} }
} }

View File

@ -30,7 +30,6 @@ import eu.kanade.tachiyomi.R
fun BrowseSourceComfortableGrid( fun BrowseSourceComfortableGrid(
mangaList: LazyPagingItems<Manga>, mangaList: LazyPagingItems<Manga>,
getMangaState: @Composable ((Manga) -> State<Manga>), getMangaState: @Composable ((Manga) -> State<Manga>),
header: (@Composable () -> Unit)? = null,
columns: GridCells, columns: GridCells,
contentPadding: PaddingValues, contentPadding: PaddingValues,
onMangaClick: (Manga) -> Unit, onMangaClick: (Manga) -> Unit,
@ -42,12 +41,6 @@ fun BrowseSourceComfortableGrid(
horizontalArrangement = Arrangement.spacedBy(8.dp), horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalArrangement = Arrangement.spacedBy(8.dp), verticalArrangement = Arrangement.spacedBy(8.dp),
) { ) {
if (header != null) {
item(span = { GridItemSpan(maxLineSpan) }) {
header()
}
}
if (mangaList.loadState.prepend is LoadState.Loading) { if (mangaList.loadState.prepend is LoadState.Loading) {
item(span = { GridItemSpan(maxLineSpan) }) { item(span = { GridItemSpan(maxLineSpan) }) {
BrowseSourceLoadingItem() BrowseSourceLoadingItem()

View File

@ -41,7 +41,6 @@ fun BrowseSourceCompactGrid(
contentPadding: PaddingValues, contentPadding: PaddingValues,
onMangaClick: (Manga) -> Unit, onMangaClick: (Manga) -> Unit,
onMangaLongClick: (Manga) -> Unit, onMangaLongClick: (Manga) -> Unit,
header: (@Composable () -> Unit)? = null,
) { ) {
LazyVerticalGrid( LazyVerticalGrid(
columns = columns, columns = columns,
@ -49,12 +48,6 @@ fun BrowseSourceCompactGrid(
horizontalArrangement = Arrangement.spacedBy(8.dp), horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalArrangement = Arrangement.spacedBy(8.dp), verticalArrangement = Arrangement.spacedBy(8.dp),
) { ) {
if (header != null) {
item(span = { GridItemSpan(maxLineSpan) }) {
header()
}
}
item(span = { GridItemSpan(maxLineSpan) }) { item(span = { GridItemSpan(maxLineSpan) }) {
if (mangaList.loadState.prepend is LoadState.Loading) { if (mangaList.loadState.prepend is LoadState.Loading) {
BrowseSourceLoadingItem() BrowseSourceLoadingItem()

View File

@ -30,17 +30,10 @@ fun BrowseSourceList(
contentPadding: PaddingValues, contentPadding: PaddingValues,
onMangaClick: (Manga) -> Unit, onMangaClick: (Manga) -> Unit,
onMangaLongClick: (Manga) -> Unit, onMangaLongClick: (Manga) -> Unit,
header: (@Composable () -> Unit)? = null,
) { ) {
LazyColumn( LazyColumn(
contentPadding = contentPadding, contentPadding = contentPadding,
) { ) {
if (header != null) {
item {
header()
}
}
item { item {
if (mangaList.loadState.prepend is LoadState.Loading) { if (mangaList.loadState.prepend is LoadState.Loading) {
BrowseSourceLoadingItem() BrowseSourceLoadingItem()

View File

@ -39,7 +39,7 @@ fun BrowseSourceToolbar(
onWebViewClick: () -> Unit, onWebViewClick: () -> Unit,
onHelpClick: () -> Unit, onHelpClick: () -> Unit,
onSearch: () -> Unit, onSearch: () -> Unit,
scrollBehavior: TopAppBarScrollBehavior, scrollBehavior: TopAppBarScrollBehavior? = null,
) { ) {
if (state.searchQuery == null) { if (state.searchQuery == null) {
BrowseSourceRegularToolbar( BrowseSourceRegularToolbar(
@ -75,7 +75,7 @@ fun BrowseSourceRegularToolbar(
onSearchClick: () -> Unit, onSearchClick: () -> Unit,
onWebViewClick: () -> Unit, onWebViewClick: () -> Unit,
onHelpClick: () -> Unit, onHelpClick: () -> Unit,
scrollBehavior: TopAppBarScrollBehavior, scrollBehavior: TopAppBarScrollBehavior?,
) { ) {
AppBar( AppBar(
navigateUp = navigateUp, navigateUp = navigateUp,
@ -162,7 +162,7 @@ fun BrowseSourceSearchToolbar(
navigateUp: () -> Unit, navigateUp: () -> Unit,
onResetClick: () -> Unit, onResetClick: () -> Unit,
onSearchClick: () -> Unit, onSearchClick: () -> Unit,
scrollBehavior: TopAppBarScrollBehavior, scrollBehavior: TopAppBarScrollBehavior?,
) { ) {
SearchToolbar( SearchToolbar(
searchQuery = searchQuery, searchQuery = searchQuery,

View File

@ -59,7 +59,7 @@ open class BrowseSourceController(bundle: Bundle) :
router.popCurrentController() router.popCurrentController()
} }
}, },
onFabClick = { filterSheet?.show() }, openFilterSheet = { filterSheet?.show() },
onMangaClick = { router.pushController(MangaController(it.id, true)) }, onMangaClick = { router.pushController(MangaController(it.id, true)) },
onMangaLongClick = { manga -> onMangaLongClick = { manga ->
scope.launchIO { scope.launchIO {