mirror of
https://github.com/tapframe/NuvioStreaming.git
synced 2026-07-29 23:59:32 +00:00
feat(search): Add dynamic column count for discover content based on screen width
This commit is contained in:
parent
b8f7ebdc4b
commit
0fed9edc18
2 changed files with 49 additions and 18 deletions
|
|
@ -51,6 +51,7 @@ import com.nuvio.app.features.watching.application.WatchingState
|
|||
|
||||
internal fun LazyListScope.discoverContent(
|
||||
state: DiscoverUiState,
|
||||
columns: Int,
|
||||
onTypeSelected: (String) -> Unit,
|
||||
onCatalogSelected: (String) -> Unit,
|
||||
onGenreSelected: (String?) -> Unit,
|
||||
|
|
@ -87,7 +88,10 @@ internal fun LazyListScope.discoverContent(
|
|||
when {
|
||||
state.isLoading && state.items.isEmpty() -> {
|
||||
items(2) {
|
||||
DiscoverSkeletonRow(modifier = Modifier.padding(horizontal = 16.dp))
|
||||
DiscoverSkeletonRow(
|
||||
columns = columns,
|
||||
modifier = Modifier.padding(horizontal = 16.dp),
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -102,9 +106,10 @@ internal fun LazyListScope.discoverContent(
|
|||
}
|
||||
|
||||
else -> {
|
||||
items(state.items.chunked(3)) { rowItems ->
|
||||
items(state.items.chunked(columns)) { rowItems ->
|
||||
DiscoverGridRow(
|
||||
items = rowItems,
|
||||
columns = columns,
|
||||
modifier = Modifier.padding(horizontal = 16.dp),
|
||||
watchedKeys = watchedKeys,
|
||||
onPosterClick = onPosterClick,
|
||||
|
|
@ -234,6 +239,7 @@ private fun DiscoverDropdownChip(
|
|||
@Composable
|
||||
private fun DiscoverGridRow(
|
||||
items: List<MetaPreview>,
|
||||
columns: Int,
|
||||
modifier: Modifier = Modifier,
|
||||
watchedKeys: Set<String> = emptySet(),
|
||||
onPosterClick: ((MetaPreview) -> Unit)? = null,
|
||||
|
|
@ -256,7 +262,7 @@ private fun DiscoverGridRow(
|
|||
onLongClick = onPosterLongClick?.let { { it(item) } },
|
||||
)
|
||||
}
|
||||
repeat(3 - items.size) {
|
||||
repeat(columns - items.size) {
|
||||
Spacer(modifier = Modifier.weight(1f))
|
||||
}
|
||||
}
|
||||
|
|
@ -321,12 +327,15 @@ private fun DiscoverPosterTile(
|
|||
}
|
||||
|
||||
@Composable
|
||||
private fun DiscoverSkeletonRow(modifier: Modifier = Modifier) {
|
||||
private fun DiscoverSkeletonRow(
|
||||
columns: Int,
|
||||
modifier: Modifier = Modifier,
|
||||
) {
|
||||
Row(
|
||||
modifier = modifier.fillMaxWidth(),
|
||||
horizontalArrangement = Arrangement.spacedBy(12.dp),
|
||||
) {
|
||||
repeat(3) {
|
||||
repeat(columns) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.weight(1f)
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ import androidx.compose.foundation.clickable
|
|||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Arrangement
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.BoxWithConstraints
|
||||
import androidx.compose.foundation.layout.Column
|
||||
import androidx.compose.foundation.layout.Row
|
||||
import androidx.compose.foundation.layout.Spacer
|
||||
|
|
@ -32,6 +33,7 @@ import androidx.compose.runtime.snapshotFlow
|
|||
import androidx.compose.runtime.setValue
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.unit.Dp
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.unit.dp
|
||||
|
|
@ -145,13 +147,22 @@ fun SearchScreen(
|
|||
SearchHistoryRepository.recordSearch(normalizedQuery)
|
||||
}
|
||||
|
||||
NuvioScreen(
|
||||
horizontalPadding = 0.dp,
|
||||
listState = listState,
|
||||
BoxWithConstraints(
|
||||
modifier = modifier
|
||||
.fillMaxSize()
|
||||
.background(MaterialTheme.colorScheme.background),
|
||||
) {
|
||||
val discoverColumns = remember(maxWidth) {
|
||||
discoverColumnCountForWidth(maxWidth)
|
||||
}
|
||||
|
||||
NuvioScreen(
|
||||
horizontalPadding = 0.dp,
|
||||
listState = listState,
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.background(MaterialTheme.colorScheme.background),
|
||||
) {
|
||||
stickyHeader {
|
||||
androidx.compose.foundation.layout.Column(
|
||||
modifier = Modifier
|
||||
|
|
@ -184,16 +195,17 @@ fun SearchScreen(
|
|||
)
|
||||
}
|
||||
}
|
||||
discoverContent(
|
||||
state = discoverUiState,
|
||||
onTypeSelected = SearchRepository::selectDiscoverType,
|
||||
onCatalogSelected = SearchRepository::selectDiscoverCatalog,
|
||||
onGenreSelected = SearchRepository::selectDiscoverGenre,
|
||||
watchedKeys = watchedUiState.watchedKeys,
|
||||
onPosterClick = onPosterClick,
|
||||
onPosterLongClick = onPosterLongClick,
|
||||
)
|
||||
} else {
|
||||
discoverContent(
|
||||
state = discoverUiState,
|
||||
columns = discoverColumns,
|
||||
onTypeSelected = SearchRepository::selectDiscoverType,
|
||||
onCatalogSelected = SearchRepository::selectDiscoverCatalog,
|
||||
onGenreSelected = SearchRepository::selectDiscoverGenre,
|
||||
watchedKeys = watchedUiState.watchedKeys,
|
||||
onPosterClick = onPosterClick,
|
||||
onPosterLongClick = onPosterLongClick,
|
||||
)
|
||||
} else {
|
||||
when {
|
||||
uiState.isLoading && uiState.sections.isEmpty() -> {
|
||||
items(2) {
|
||||
|
|
@ -228,6 +240,16 @@ fun SearchScreen(
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private fun discoverColumnCountForWidth(screenWidth: Dp): Int =
|
||||
when {
|
||||
screenWidth >= 1400.dp -> 7
|
||||
screenWidth >= 1200.dp -> 6
|
||||
screenWidth >= 1000.dp -> 5
|
||||
screenWidth >= 840.dp -> 4
|
||||
else -> 3
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun SearchEmptyStateCard(
|
||||
|
|
|
|||
Loading…
Reference in a new issue