fix(media): only show video controls on hover

Controls (play button, seek bar, volume) are hidden by default and
appear when the mouse enters the video area. They auto-hide 2s after
the mouse leaves.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
nrobi144
2026-03-17 16:27:57 +02:00
parent bce6c12ab3
commit e9249c924c
@@ -83,16 +83,16 @@ fun VideoControls(
onViewModeChange: ((ViewMode) -> Unit)? = null, onViewModeChange: ((ViewMode) -> Unit)? = null,
trailingControls: @Composable (() -> Unit)? = null, trailingControls: @Composable (() -> Unit)? = null,
) { ) {
var showControls by remember { mutableStateOf(true) }
var hovering by remember { mutableStateOf(false) } var hovering by remember { mutableStateOf(false) }
var showControls by remember { mutableStateOf(false) }
// Auto-hide controls after 2s when playing // Show controls on hover, auto-hide 2s after mouse leaves
LaunchedEffect(isPlaying, hovering) { LaunchedEffect(hovering) {
if (isPlaying && !hovering) { if (hovering) {
showControls = true
} else {
delay(2000) delay(2000)
showControls = false showControls = false
} else {
showControls = true
} }
} }
@@ -119,14 +119,14 @@ fun VideoControls(
} }
}, },
) { ) {
// Center play/buffering indicator // Center play/buffering indicator — only on hover
if (isBuffering) { if (isBuffering) {
CircularProgressIndicator( CircularProgressIndicator(
modifier = Modifier.align(Alignment.Center).size(48.dp), modifier = Modifier.align(Alignment.Center).size(48.dp),
color = Color.White, color = Color.White,
strokeWidth = 3.dp, strokeWidth = 3.dp,
) )
} else if (!isPlaying) { } else if (!isPlaying && showControls) {
IconButton( IconButton(
onClick = onPlayPause, onClick = onPlayPause,
modifier = Modifier.align(Alignment.Center).size(64.dp), modifier = Modifier.align(Alignment.Center).size(64.dp),