diff --git a/app/src/main/java/me/zobrist/tichucounter/ui/history/HistoryView.kt b/app/src/main/java/me/zobrist/tichucounter/ui/history/HistoryView.kt index 8f822d7..6af5e52 100644 --- a/app/src/main/java/me/zobrist/tichucounter/ui/history/HistoryView.kt +++ b/app/src/main/java/me/zobrist/tichucounter/ui/history/HistoryView.kt @@ -12,6 +12,7 @@ import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyListState @@ -25,18 +26,17 @@ import androidx.compose.material3.AlertDialog import androidx.compose.material3.Badge import androidx.compose.material3.Button import androidx.compose.material3.Card -import androidx.compose.material3.DismissDirection -import androidx.compose.material3.DismissValue import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme import androidx.compose.material3.SnackbarDuration import androidx.compose.material3.SnackbarHostState import androidx.compose.material3.SnackbarResult -import androidx.compose.material3.SwipeToDismiss +import androidx.compose.material3.SwipeToDismissBox +import androidx.compose.material3.SwipeToDismissBoxValue import androidx.compose.material3.Text import androidx.compose.material3.TextButton -import androidx.compose.material3.rememberDismissState +import androidx.compose.material3.rememberSwipeToDismissBoxState import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf @@ -48,6 +48,7 @@ import androidx.compose.ui.Alignment.Companion.CenterVertically import androidx.compose.ui.Alignment.Companion.TopEnd import androidx.compose.ui.Modifier import androidx.compose.ui.draw.scale +import androidx.compose.ui.graphics.Color import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.style.TextOverflow @@ -213,89 +214,110 @@ fun DismissibleHistoryListItem( val density = LocalDensity.current val dismissState = - rememberDismissState(positionalThreshold = { with(density) { 100.dp.toPx() } }, + rememberSwipeToDismissBoxState(positionalThreshold = { with(density) { 100.dp.toPx() } }, + confirmValueChange = { - if (it == DismissValue.DismissedToStart) { + if (it == SwipeToDismissBoxValue.EndToStart) { onDeleteClicked(game.game.uid) } - if (it == DismissValue.DismissedToEnd) { + if (it == SwipeToDismissBoxValue.StartToEnd) { onOpenClicked(game.game.uid) } true }) - val directions = if (game.game.active) { - setOf() - - } else { - setOf(DismissDirection.EndToStart, DismissDirection.StartToEnd) - } - - SwipeToDismiss( + SwipeToDismissBox( modifier = modifier, state = dismissState, - directions = directions, - background = { - val direction = dismissState.dismissDirection ?: return@SwipeToDismiss - val color by animateColorAsState( - when (dismissState.targetValue) { - DismissValue.DismissedToStart -> MaterialTheme.colorScheme.error - DismissValue.DismissedToEnd -> MaterialTheme.colorScheme.primary - else -> MaterialTheme.colorScheme.background - - }, label = "" - ) - val textColor by animateColorAsState( - when (dismissState.targetValue) { - DismissValue.DismissedToStart -> MaterialTheme.colorScheme.onError - DismissValue.DismissedToEnd -> MaterialTheme.colorScheme.onPrimary - else -> MaterialTheme.colorScheme.onBackground - - }, label = "" - ) - val alignment = when (direction) { - DismissDirection.StartToEnd -> Alignment.CenterStart - DismissDirection.EndToStart -> Alignment.CenterEnd - } - val icon = when (direction) { - DismissDirection.StartToEnd -> Icons.Outlined.RestartAlt - DismissDirection.EndToStart -> Icons.Outlined.Delete - } - val text = when (direction) { - DismissDirection.StartToEnd -> stringResource(id = R.string.continue_play) - DismissDirection.EndToStart -> stringResource(id = R.string.delete) - } - val scale by animateFloatAsState( - if (dismissState.targetValue == DismissValue.Default) 0.75f else 1f, label = "" - ) - - Box( - Modifier - .fillMaxSize() - .padding(top = 2.dp, bottom = 2.dp) - .background(color) - .padding(horizontal = 10.dp), - contentAlignment = alignment - ) { - Column( - verticalArrangement = Arrangement.Center, - horizontalAlignment = Alignment.CenterHorizontally - ) { - Icon( - icon, - contentDescription = null, - modifier = Modifier.scale(scale), - tint = textColor - ) - Text(text = text, color = textColor) - } - } - }, dismissContent = { + enableDismissFromEndToStart = true, + enableDismissFromStartToEnd = true, + backgroundContent = { + ItemBackground(dismissState.targetValue) + }, content = { HistoryListItem(game = game, modifier = Modifier.padding(2.dp)) }) } @OptIn(ExperimentalMaterial3Api::class) +@Composable +fun ItemBackground( + dismissBoxValue: SwipeToDismissBoxValue +) +{ + val backgroundColor by animateColorAsState( + when (dismissBoxValue) { + SwipeToDismissBoxValue.EndToStart -> MaterialTheme.colorScheme.error + SwipeToDismissBoxValue.StartToEnd-> MaterialTheme.colorScheme.primary + else -> MaterialTheme.colorScheme.background + + }, label = "" + ) + val textColor by animateColorAsState( + when (dismissBoxValue) { + SwipeToDismissBoxValue.EndToStart -> MaterialTheme.colorScheme.onError + SwipeToDismissBoxValue.StartToEnd -> MaterialTheme.colorScheme.onPrimary + else -> MaterialTheme.colorScheme.onBackground + + }, label = "" + ) + val scale by animateFloatAsState( + if (dismissBoxValue == SwipeToDismissBoxValue.Settled) 0.75f else 1f, label = "" + ) + + Box( + Modifier + .fillMaxSize() + .padding(top = 2.dp, bottom = 2.dp) + .background(backgroundColor) + .padding(horizontal = 10.dp), + ) { + Column( + verticalArrangement = Arrangement.Center, + horizontalAlignment = Alignment.CenterHorizontally, + modifier = Modifier.align(Alignment.CenterStart) + ) { + Icon(Icons.Outlined.RestartAlt, + contentDescription = null, + tint = textColor, + modifier = Modifier.scale(scale),) + Text(text = stringResource(id = R.string.continue_play), color = textColor) + } + Column( + verticalArrangement = Arrangement.Center, + horizontalAlignment = Alignment.CenterHorizontally, + modifier = Modifier.align(Alignment.CenterEnd) + + ) { + Icon(Icons.Outlined.Delete, + contentDescription = null, + tint = textColor, + modifier = Modifier.scale(scale),) + Text(text = stringResource(id = R.string.delete), color = textColor) + } + } +} + +@OptIn(ExperimentalMaterial3Api::class) +@Preview +@Composable +private fun BackgroundPreview() { + Column { + Box(modifier = Modifier.height(60.dp)) + { + ItemBackground(SwipeToDismissBoxValue.Settled) + } + Box(modifier = Modifier.height(60.dp)) + { + ItemBackground(SwipeToDismissBoxValue.EndToStart) + } + Box(modifier = Modifier.height(60.dp)) + { + ItemBackground(SwipeToDismissBoxValue.StartToEnd) + } + } +} + + @Composable fun HistoryListItem( game: GameWithScores, modifier: Modifier = Modifier