From 58d59a555decdc1be743897ff35a5b7bc2c29c3a Mon Sep 17 00:00:00 2001 From: Cuong-Tran Date: Thu, 24 Oct 2024 00:41:35 +0700 Subject: [PATCH] sticky header --- .../LibraryUpdateErrorScreen.kt | 9 +- .../components/LibraryUpdateErrorUiItem.kt | 86 +++++++++---------- .../core/components/ListGroupHeader.kt | 28 +++--- 3 files changed, 64 insertions(+), 59 deletions(-) diff --git a/app/src/main/java/eu/kanade/presentation/libraryUpdateError/LibraryUpdateErrorScreen.kt b/app/src/main/java/eu/kanade/presentation/libraryUpdateError/LibraryUpdateErrorScreen.kt index a5b93b3b3..6273b6f2d 100644 --- a/app/src/main/java/eu/kanade/presentation/libraryUpdateError/LibraryUpdateErrorScreen.kt +++ b/app/src/main/java/eu/kanade/presentation/libraryUpdateError/LibraryUpdateErrorScreen.kt @@ -130,17 +130,18 @@ fun LibraryUpdateErrorScreen( }, ) }, - ) { paddingValues -> + ) { contentPadding -> when { - state.isLoading -> LoadingScreen(modifier = Modifier.padding(paddingValues)) + state.isLoading -> LoadingScreen(modifier = Modifier.padding(contentPadding)) state.items.isEmpty() -> EmptyScreen( message = stringResource(MR.strings.info_empty_library_update_errors), - modifier = Modifier.padding(paddingValues), + modifier = Modifier.padding(contentPadding), ) else -> { FastScrollLazyColumn( - contentPadding = paddingValues, + // Using modifier instead of contentPadding so we can use stickyHeader + modifier = Modifier.padding(contentPadding), state = listState, ) { libraryUpdateErrorUiItems( diff --git a/app/src/main/java/eu/kanade/presentation/libraryUpdateError/components/LibraryUpdateErrorUiItem.kt b/app/src/main/java/eu/kanade/presentation/libraryUpdateError/components/LibraryUpdateErrorUiItem.kt index dca14c78c..f8d68da93 100644 --- a/app/src/main/java/eu/kanade/presentation/libraryUpdateError/components/LibraryUpdateErrorUiItem.kt +++ b/app/src/main/java/eu/kanade/presentation/libraryUpdateError/components/LibraryUpdateErrorUiItem.kt @@ -6,7 +6,6 @@ import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyListScope -import androidx.compose.foundation.lazy.items import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.runtime.Composable @@ -17,10 +16,12 @@ import androidx.compose.ui.platform.LocalHapticFeedback import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp import eu.kanade.presentation.manga.components.MangaCover +import eu.kanade.presentation.util.animateItemFastScroll import eu.kanade.tachiyomi.ui.libraryUpdateError.LibraryUpdateErrorItem import tachiyomi.domain.libraryUpdateError.model.LibraryUpdateErrorWithRelations import tachiyomi.domain.source.service.SourceManager import tachiyomi.presentation.core.components.ListGroupHeader +import tachiyomi.presentation.core.components.Scroller.STICKY_HEADER_KEY_PREFIX import tachiyomi.presentation.core.components.material.padding import tachiyomi.presentation.core.util.secondaryItemAlpha import tachiyomi.presentation.core.util.selectedBackground @@ -34,57 +35,52 @@ internal fun LazyListScope.libraryUpdateErrorUiItems( onClick: (LibraryUpdateErrorItem) -> Unit, onClickCover: (LibraryUpdateErrorItem) -> Unit, ) { - items( - items = uiModels, - contentType = { - when (it) { - is LibraryUpdateErrorUiModel.Header -> "header" - is LibraryUpdateErrorUiModel.Item -> "item" - } - }, - key = { - when (it) { - is LibraryUpdateErrorUiModel.Header -> "sticky:errorHeader-${it.hashCode()}" - is LibraryUpdateErrorUiModel.Item -> "error-${it.item.error.errorId}-${it.item.error.mangaId}" - } - }, - ) { item -> - when (item) { + uiModels.forEach { + when (it) { is LibraryUpdateErrorUiModel.Header -> { - ListGroupHeader( - modifier = Modifier.animateItemPlacement(), - text = item.errorMessage, - ) + stickyHeader( + key = "$STICKY_HEADER_KEY_PREFIX-errorHeader-${it.hashCode()}", + contentType = "header", + ) { + ListGroupHeader( + modifier = Modifier.animateItemFastScroll(), + text = it.errorMessage, + ) + } } - is LibraryUpdateErrorUiModel.Item -> { - val libraryUpdateErrorItem = item.item - LibraryUpdateErrorUiItem( - modifier = Modifier.animateItemPlacement(), - error = libraryUpdateErrorItem.error, - selected = libraryUpdateErrorItem.selected, - onClick = { - when { - selectionMode -> onErrorSelected( + item( + key = "error-${it.item.error.errorId}-${it.item.error.mangaId}", + contentType = "item", + ) { + val libraryUpdateErrorItem = it.item + LibraryUpdateErrorUiItem( + modifier = Modifier.animateItemFastScroll(), + error = libraryUpdateErrorItem.error, + selected = libraryUpdateErrorItem.selected, + onClick = { + when { + selectionMode -> onErrorSelected( + libraryUpdateErrorItem, + !libraryUpdateErrorItem.selected, + true, + false, + ) + + else -> onClick(libraryUpdateErrorItem) + } + }, + onLongClick = { + onErrorSelected( libraryUpdateErrorItem, !libraryUpdateErrorItem.selected, true, - false, + true, ) - - else -> onClick(libraryUpdateErrorItem) - } - }, - onLongClick = { - onErrorSelected( - libraryUpdateErrorItem, - !libraryUpdateErrorItem.selected, - true, - true, - ) - }, - onClickCover = { onClickCover(libraryUpdateErrorItem) }.takeIf { !selectionMode }, - ) + }, + onClickCover = { onClickCover(libraryUpdateErrorItem) }.takeIf { !selectionMode }, + ) + } } } } diff --git a/presentation-core/src/main/java/tachiyomi/presentation/core/components/ListGroupHeader.kt b/presentation-core/src/main/java/tachiyomi/presentation/core/components/ListGroupHeader.kt index 1aaba373e..2dd3a945b 100644 --- a/presentation-core/src/main/java/tachiyomi/presentation/core/components/ListGroupHeader.kt +++ b/presentation-core/src/main/java/tachiyomi/presentation/core/components/ListGroupHeader.kt @@ -1,7 +1,9 @@ package tachiyomi.presentation.core.components +import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier @@ -13,15 +15,21 @@ fun ListGroupHeader( text: String, modifier: Modifier = Modifier, ) { - Text( - text = text, + Surface( modifier = modifier - .padding( - horizontal = MaterialTheme.padding.medium, - vertical = MaterialTheme.padding.small, - ), - color = MaterialTheme.colorScheme.onSurfaceVariant, - fontWeight = FontWeight.SemiBold, - style = MaterialTheme.typography.bodyMedium, - ) + .fillMaxWidth(), + color = MaterialTheme.colorScheme.surfaceContainerLow, + ) { + Text( + text = text, + modifier = Modifier + .padding( + horizontal = MaterialTheme.padding.medium, + vertical = MaterialTheme.padding.small, + ), + color = MaterialTheme.colorScheme.onSurfaceVariant, + fontWeight = FontWeight.SemiBold, + style = MaterialTheme.typography.bodyMedium, + ) + } }