AdaptiveSheet: Wrap inside Dialog (#9279)
Because of Compose issue, the style of the sheet surface is adjusted as a workaround Ref https://issuetracker.google.com/issues/246909281
This commit is contained in:
parent
be8e2f119f
commit
6f1099b710
@ -14,6 +14,8 @@ import androidx.compose.foundation.layout.only
|
|||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.ui.unit.Dp
|
import androidx.compose.ui.unit.Dp
|
||||||
import androidx.compose.ui.unit.dp
|
import androidx.compose.ui.unit.dp
|
||||||
|
import androidx.compose.ui.window.Dialog
|
||||||
|
import androidx.compose.ui.window.DialogProperties
|
||||||
import cafe.adriel.voyager.core.lifecycle.DisposableEffectIgnoringConfiguration
|
import cafe.adriel.voyager.core.lifecycle.DisposableEffectIgnoringConfiguration
|
||||||
import cafe.adriel.voyager.core.screen.Screen
|
import cafe.adriel.voyager.core.screen.Screen
|
||||||
import cafe.adriel.voyager.navigator.Navigator
|
import cafe.adriel.voyager.navigator.Navigator
|
||||||
@ -78,6 +80,12 @@ fun AdaptiveSheet(
|
|||||||
content: @Composable (PaddingValues) -> Unit,
|
content: @Composable (PaddingValues) -> Unit,
|
||||||
) {
|
) {
|
||||||
val isTabletUi = isTabletUi()
|
val isTabletUi = isTabletUi()
|
||||||
|
Dialog(
|
||||||
|
onDismissRequest = onDismissRequest,
|
||||||
|
properties = DialogProperties(
|
||||||
|
usePlatformDefaultWidth = false,
|
||||||
|
),
|
||||||
|
) {
|
||||||
AdaptiveSheetImpl(
|
AdaptiveSheetImpl(
|
||||||
isTabletUi = isTabletUi,
|
isTabletUi = isTabletUi,
|
||||||
tonalElevation = tonalElevation,
|
tonalElevation = tonalElevation,
|
||||||
@ -92,3 +100,4 @@ fun AdaptiveSheet(
|
|||||||
content(contentPadding)
|
content(contentPadding)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
@ -245,7 +245,7 @@ object LibraryTab : Tab {
|
|||||||
}
|
}
|
||||||
|
|
||||||
LaunchedEffect(state.selectionMode, state.dialog) {
|
LaunchedEffect(state.selectionMode, state.dialog) {
|
||||||
HomeScreen.showBottomNav(!state.selectionMode && state.dialog !is LibraryScreenModel.Dialog.SettingsSheet)
|
HomeScreen.showBottomNav(!state.selectionMode)
|
||||||
}
|
}
|
||||||
|
|
||||||
LaunchedEffect(state.isLoading) {
|
LaunchedEffect(state.isLoading) {
|
||||||
|
@ -3,15 +3,12 @@ package tachiyomi.presentation.core.components
|
|||||||
import androidx.activity.compose.BackHandler
|
import androidx.activity.compose.BackHandler
|
||||||
import androidx.compose.animation.core.animateFloatAsState
|
import androidx.compose.animation.core.animateFloatAsState
|
||||||
import androidx.compose.animation.core.tween
|
import androidx.compose.animation.core.tween
|
||||||
import androidx.compose.foundation.background
|
|
||||||
import androidx.compose.foundation.clickable
|
import androidx.compose.foundation.clickable
|
||||||
import androidx.compose.foundation.gestures.Orientation
|
import androidx.compose.foundation.gestures.Orientation
|
||||||
import androidx.compose.foundation.interaction.MutableInteractionSource
|
import androidx.compose.foundation.interaction.MutableInteractionSource
|
||||||
import androidx.compose.foundation.layout.Box
|
|
||||||
import androidx.compose.foundation.layout.BoxWithConstraints
|
import androidx.compose.foundation.layout.BoxWithConstraints
|
||||||
import androidx.compose.foundation.layout.WindowInsets
|
import androidx.compose.foundation.layout.WindowInsets
|
||||||
import androidx.compose.foundation.layout.WindowInsetsSides
|
import androidx.compose.foundation.layout.WindowInsetsSides
|
||||||
import androidx.compose.foundation.layout.consumeWindowInsets
|
|
||||||
import androidx.compose.foundation.layout.fillMaxSize
|
import androidx.compose.foundation.layout.fillMaxSize
|
||||||
import androidx.compose.foundation.layout.offset
|
import androidx.compose.foundation.layout.offset
|
||||||
import androidx.compose.foundation.layout.only
|
import androidx.compose.foundation.layout.only
|
||||||
@ -21,7 +18,6 @@ import androidx.compose.foundation.layout.systemBars
|
|||||||
import androidx.compose.foundation.layout.systemBarsPadding
|
import androidx.compose.foundation.layout.systemBarsPadding
|
||||||
import androidx.compose.foundation.layout.widthIn
|
import androidx.compose.foundation.layout.widthIn
|
||||||
import androidx.compose.foundation.layout.windowInsetsPadding
|
import androidx.compose.foundation.layout.windowInsetsPadding
|
||||||
import androidx.compose.foundation.shape.ZeroCornerSize
|
|
||||||
import androidx.compose.material.SwipeableState
|
import androidx.compose.material.SwipeableState
|
||||||
import androidx.compose.material.rememberSwipeableState
|
import androidx.compose.material.rememberSwipeableState
|
||||||
import androidx.compose.material.swipeable
|
import androidx.compose.material.swipeable
|
||||||
@ -46,18 +42,14 @@ import androidx.compose.ui.unit.Dp
|
|||||||
import androidx.compose.ui.unit.IntOffset
|
import androidx.compose.ui.unit.IntOffset
|
||||||
import androidx.compose.ui.unit.Velocity
|
import androidx.compose.ui.unit.Velocity
|
||||||
import androidx.compose.ui.unit.dp
|
import androidx.compose.ui.unit.dp
|
||||||
import kotlinx.coroutines.delay
|
|
||||||
import kotlinx.coroutines.flow.collectLatest
|
import kotlinx.coroutines.flow.collectLatest
|
||||||
import kotlinx.coroutines.flow.drop
|
import kotlinx.coroutines.flow.drop
|
||||||
import kotlinx.coroutines.flow.filter
|
import kotlinx.coroutines.flow.filter
|
||||||
import kotlinx.coroutines.launch
|
import kotlinx.coroutines.launch
|
||||||
import kotlin.math.roundToInt
|
import kotlin.math.roundToInt
|
||||||
import kotlin.time.Duration.Companion.milliseconds
|
|
||||||
|
|
||||||
private const val SheetAnimationDuration = 500
|
private const val SheetAnimationDuration = 350
|
||||||
private val SheetAnimationSpec = tween<Float>(durationMillis = SheetAnimationDuration)
|
private val SheetAnimationSpec = tween<Float>(durationMillis = SheetAnimationDuration)
|
||||||
private const val ScrimAnimationDuration = 350
|
|
||||||
private val ScrimAnimationSpec = tween<Float>(durationMillis = ScrimAnimationDuration)
|
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
fun AdaptiveSheet(
|
fun AdaptiveSheet(
|
||||||
@ -72,12 +64,11 @@ fun AdaptiveSheet(
|
|||||||
var targetAlpha by remember { mutableStateOf(0f) }
|
var targetAlpha by remember { mutableStateOf(0f) }
|
||||||
val alpha by animateFloatAsState(
|
val alpha by animateFloatAsState(
|
||||||
targetValue = targetAlpha,
|
targetValue = targetAlpha,
|
||||||
animationSpec = ScrimAnimationSpec,
|
animationSpec = SheetAnimationSpec,
|
||||||
)
|
)
|
||||||
val internalOnDismissRequest: () -> Unit = {
|
val internalOnDismissRequest: () -> Unit = {
|
||||||
scope.launch {
|
scope.launch {
|
||||||
targetAlpha = 0f
|
targetAlpha = 0f
|
||||||
delay(ScrimAnimationSpec.durationMillis.milliseconds)
|
|
||||||
onDismissRequest()
|
onDismissRequest()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -93,11 +84,6 @@ fun AdaptiveSheet(
|
|||||||
.alpha(alpha),
|
.alpha(alpha),
|
||||||
contentAlignment = Alignment.Center,
|
contentAlignment = Alignment.Center,
|
||||||
) {
|
) {
|
||||||
Box(
|
|
||||||
modifier = Modifier
|
|
||||||
.matchParentSize()
|
|
||||||
.background(MaterialTheme.colorScheme.scrim.copy(alpha = 0.32f)),
|
|
||||||
)
|
|
||||||
Surface(
|
Surface(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.requiredWidthIn(max = 460.dp)
|
.requiredWidthIn(max = 460.dp)
|
||||||
@ -138,16 +124,6 @@ fun AdaptiveSheet(
|
|||||||
) {
|
) {
|
||||||
val fullHeight = constraints.maxHeight.toFloat()
|
val fullHeight = constraints.maxHeight.toFloat()
|
||||||
val anchors = mapOf(0f to 0, fullHeight to 1)
|
val anchors = mapOf(0f to 0, fullHeight to 1)
|
||||||
val scrimAlpha by animateFloatAsState(
|
|
||||||
targetValue = if (swipeState.targetValue == 1) 0f else 1f,
|
|
||||||
animationSpec = ScrimAnimationSpec,
|
|
||||||
)
|
|
||||||
Box(
|
|
||||||
modifier = Modifier
|
|
||||||
.matchParentSize()
|
|
||||||
.alpha(scrimAlpha)
|
|
||||||
.background(MaterialTheme.colorScheme.scrim.copy(alpha = 0.32f)),
|
|
||||||
)
|
|
||||||
Surface(
|
Surface(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.widthIn(max = 460.dp)
|
.widthIn(max = 460.dp)
|
||||||
@ -180,12 +156,8 @@ fun AdaptiveSheet(
|
|||||||
.windowInsetsPadding(
|
.windowInsetsPadding(
|
||||||
WindowInsets.systemBars
|
WindowInsets.systemBars
|
||||||
.only(WindowInsetsSides.Top + WindowInsetsSides.Horizontal),
|
.only(WindowInsetsSides.Top + WindowInsetsSides.Horizontal),
|
||||||
)
|
|
||||||
.consumeWindowInsets(
|
|
||||||
WindowInsets.systemBars
|
|
||||||
.only(WindowInsetsSides.Top + WindowInsetsSides.Horizontal),
|
|
||||||
),
|
),
|
||||||
shape = MaterialTheme.shapes.extraLarge.copy(bottomStart = ZeroCornerSize, bottomEnd = ZeroCornerSize),
|
shape = MaterialTheme.shapes.extraLarge,
|
||||||
tonalElevation = tonalElevation,
|
tonalElevation = tonalElevation,
|
||||||
content = {
|
content = {
|
||||||
BackHandler(enabled = swipeState.targetValue == 0, onBack = internalOnDismissRequest)
|
BackHandler(enabled = swipeState.targetValue == 0, onBack = internalOnDismissRequest)
|
||||||
@ -199,7 +171,6 @@ fun AdaptiveSheet(
|
|||||||
.drop(1)
|
.drop(1)
|
||||||
.filter { it == 1 }
|
.filter { it == 1 }
|
||||||
.collectLatest {
|
.collectLatest {
|
||||||
delay(ScrimAnimationSpec.durationMillis.milliseconds)
|
|
||||||
onDismissRequest()
|
onDismissRequest()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user