Adjust dock overlay

This commit is contained in:
2026-05-18 21:54:42 +02:00
parent 488509db06
commit f1e391ccda
4 changed files with 29 additions and 4 deletions

View File

@@ -122,6 +122,7 @@ private fun DockBarExpanded(
overlayCenterX = anim.overlayCenterX, overlayCenterX = anim.overlayCenterX,
overlayWidthPx = anim.overlayWidthPx, overlayWidthPx = anim.overlayWidthPx,
overlayAlpha = anim.overlayAlpha, overlayAlpha = anim.overlayAlpha,
overlayPeakProgress = anim.overlayPeakProgress,
dockWidthPx = dockWidthPx, dockWidthPx = dockWidthPx,
dockHeight = height, dockHeight = height,
) )

View File

@@ -38,6 +38,7 @@ internal data class DockOverlayAnimations(
val overlayCenterX: Float, val overlayCenterX: Float,
val overlayWidthPx: Float, val overlayWidthPx: Float,
val overlayAlpha: Float, val overlayAlpha: Float,
val overlayPeakProgress: Float,
val activeIndicatorAlpha: Float, val activeIndicatorAlpha: Float,
) )
@@ -93,8 +94,10 @@ internal fun rememberDockOverlayAnimations(
val pressing = pressState is DockPressState.Pressing val pressing = pressState is DockPressState.Pressing
val activeCenterXState = rememberUpdatedState(activeCenterX) val activeCenterXState = rememberUpdatedState(activeCenterX)
var releaseSlideStartX by remember { mutableStateOf<Float?>(null) }
LaunchedEffect(pressing) { LaunchedEffect(pressing) {
if (pressing) { if (pressing) {
releaseSlideStartX = null
activeAlphaAnim.snapTo(0f) activeAlphaAnim.snapTo(0f)
overlayAlphaAnim.animateTo( overlayAlphaAnim.animateTo(
targetValue = 1f, targetValue = 1f,
@@ -102,6 +105,7 @@ internal fun rememberDockOverlayAnimations(
) )
} else { } else {
if (overlayAlphaAnim.value <= 0f) return@LaunchedEffect if (overlayAlphaAnim.value <= 0f) return@LaunchedEffect
releaseSlideStartX = centerAnim.value
if (overlayAlphaAnim.value < 1f) { if (overlayAlphaAnim.value < 1f) {
val tailMs = ((1f - overlayAlphaAnim.value) * OverlayFadeInDurationMs) val tailMs = ((1f - overlayAlphaAnim.value) * OverlayFadeInDurationMs)
.toInt() .toInt()
@@ -128,13 +132,28 @@ internal fun rememberDockOverlayAnimations(
) )
} }
} }
releaseSlideStartX = null
} }
} }
val releaseSlideProgress = run {
val start = releaseSlideStartX
if (start == null) {
0f
} else {
val target = activeCenterXState.value
val total = abs(target - start)
if (total < 1f) 0f
else (abs(centerAnim.value - start) / total).coerceIn(0f, 1f)
}
}
val overlayPeakProgress = overlayAlphaAnim.value * (1f - releaseSlideProgress)
return DockOverlayAnimations( return DockOverlayAnimations(
overlayCenterX = centerAnim.value, overlayCenterX = centerAnim.value,
overlayWidthPx = overlayWidthPx, overlayWidthPx = overlayWidthPx,
overlayAlpha = overlayAlphaAnim.value, overlayAlpha = overlayAlphaAnim.value,
overlayPeakProgress = overlayPeakProgress,
activeIndicatorAlpha = activeAlphaAnim.value, activeIndicatorAlpha = activeAlphaAnim.value,
) )
} }

View File

@@ -67,6 +67,7 @@ internal fun DockPressOverlayLayer(
overlayCenterX: Float, overlayCenterX: Float,
overlayWidthPx: Float, overlayWidthPx: Float,
overlayAlpha: Float, overlayAlpha: Float,
overlayPeakProgress: Float,
dockWidthPx: Float, dockWidthPx: Float,
dockHeight: Dp, dockHeight: Dp,
) { ) {
@@ -76,8 +77,8 @@ internal fun DockPressOverlayLayer(
val dockHeightPx = with(density) { dockHeight.toPx() } val dockHeightPx = with(density) { dockHeight.toPx() }
val activeInsetPx = with(density) { ActiveIndicatorVerticalInset.toPx() } val activeInsetPx = with(density) { ActiveIndicatorVerticalInset.toPx() }
val activeStartScaleY = if (dockHeightPx > 0f) (dockHeightPx - 2 * activeInsetPx) / dockHeightPx else 1f val activeStartScaleY = if (dockHeightPx > 0f) (dockHeightPx - 2 * activeInsetPx) / dockHeightPx else 1f
val scaleX = lerp(1f, PressOverlayScale, overlayAlpha) val scaleX = lerp(1f, PressOverlayScale, overlayPeakProgress)
val scaleY = lerp(activeStartScaleY, PressOverlayScale, overlayAlpha) val scaleY = lerp(activeStartScaleY, PressOverlayScale, overlayPeakProgress)
val cornerRadius = (dockHeight - 2 * PressOverlayVerticalInset) / 2 val cornerRadius = (dockHeight - 2 * PressOverlayVerticalInset) / 2
val leftPx = overlayCenterX - overlayWidthPx / 2f val leftPx = overlayCenterX - overlayWidthPx / 2f
@@ -94,5 +95,6 @@ internal fun DockPressOverlayLayer(
.alpha(overlayAlpha), .alpha(overlayAlpha),
cornerRadius = cornerRadius, cornerRadius = cornerRadius,
glassStyle = RecipeTheme.glass.dockPress, glassStyle = RecipeTheme.glass.dockPress,
tint = RecipeTheme.colors.surfaceGlassOverlay,
) {} ) {}
} }

View File

@@ -10,6 +10,7 @@ public data class RecipeColors(
val background: Color, val background: Color,
val surface: Color, val surface: Color,
val surfaceGlass: Color, val surfaceGlass: Color,
val surfaceGlassOverlay: Color,
val content: Color, val content: Color,
val contentMuted: Color, val contentMuted: Color,
val accent: Color, val accent: Color,
@@ -21,9 +22,10 @@ public data class RecipeColors(
public val LightRecipeColors: RecipeColors = public val LightRecipeColors: RecipeColors =
RecipeColors( RecipeColors(
background = Color(0xFFF7F5F1), background = Color(0xFFEAE6DF),
surface = Color(0xFFFFFFFF), surface = Color(0xFFFFFFFF),
surfaceGlass = Color(0xFFFFFFFF).copy(alpha = 0.42f), surfaceGlass = Color(0xFFFFFFFF).copy(alpha = 0.42f),
surfaceGlassOverlay = Color(0xFFFFFFFF).copy(alpha = 0.20f),
content = Color(0xFF0F1113), content = Color(0xFF0F1113),
contentMuted = Color(0xFF6B6E73), contentMuted = Color(0xFF6B6E73),
accent = Color(0xFFD97757), accent = Color(0xFFD97757),
@@ -37,7 +39,8 @@ public val DarkRecipeColors: RecipeColors =
RecipeColors( RecipeColors(
background = Color(0xFF0F1113), background = Color(0xFF0F1113),
surface = Color(0xFF1A1D21), surface = Color(0xFF1A1D21),
surfaceGlass = Color(0xFFFFFFFF).copy(alpha = 0.18f), surfaceGlass = Color(0xFF3A3D42).copy(alpha = 0.55f),
surfaceGlassOverlay = Color(0xFFFFFFFF).copy(alpha = 0.12f),
content = Color(0xFFF1EFEA), content = Color(0xFFF1EFEA),
contentMuted = Color(0xFF9AA0A6), contentMuted = Color(0xFF9AA0A6),
accent = Color(0xFFE48A6E), accent = Color(0xFFE48A6E),