From 1f405e6ffa2caee05a0f0b39c9423c7990d29464 Mon Sep 17 00:00:00 2001 From: jbibik Date: Thu, 8 May 2025 06:09:50 -0700 Subject: [PATCH] [demo-compose] Replace IconButton usage with clickable Icon IconButton comes with some nice defaults for padding and colour, but it also requires a Modifier, on top of Icon's modifier. That makes it difficult to specify multiple Modifiers from the caller. Since the main functionality it provides is the `enabled` and `onClick` fields, we could replicate the same behaviour using Icon's Modifier. PiperOrigin-RevId: 756280557 --- .../androidx/media3/demo/compose/MainActivity.kt | 2 +- .../demo/compose/buttons/MinimalControls.kt | 15 +++++++-------- .../media3/demo/compose/buttons/NextButton.kt | 14 ++++++-------- .../demo/compose/buttons/PlayPauseButton.kt | 10 ++++++---- .../media3/demo/compose/buttons/PreviousButton.kt | 14 ++++++-------- 5 files changed, 26 insertions(+), 29 deletions(-) diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt index 85423664bc..21d0de70a2 100644 --- a/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt +++ b/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt @@ -133,7 +133,7 @@ private fun MediaPlayerScreen(player: Player, modifier: Modifier = Modifier) { if (showControls) { // drawn on top of a potential shutter - MinimalControls(player, Modifier.align(Alignment.Center)) + MinimalControls(player, Modifier.align(Alignment.Center).fillMaxWidth()) ExtraControls( player, Modifier.fillMaxWidth() diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt index cab552098c..fca27967ce 100644 --- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt +++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt @@ -17,9 +17,8 @@ package androidx.media3.demo.compose.buttons import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.size import androidx.compose.foundation.shape.CircleShape import androidx.compose.runtime.Composable @@ -38,14 +37,14 @@ import androidx.media3.common.Player internal fun MinimalControls(player: Player, modifier: Modifier = Modifier) { val graySemiTransparentBackground = Color.Gray.copy(alpha = 0.1f) val modifierForIconButton = - modifier.size(80.dp).background(graySemiTransparentBackground, CircleShape) - Row( - modifier = modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.SpaceEvenly, - verticalAlignment = Alignment.CenterVertically, - ) { + modifier.size(40.dp).background(graySemiTransparentBackground, CircleShape) + Row(modifier = modifier, verticalAlignment = Alignment.CenterVertically) { + Spacer(Modifier.weight(1f)) PreviousButton(player, Modifier.weight(1f).then(modifierForIconButton)) + Spacer(Modifier.weight(1f)) PlayPauseButton(player, Modifier.weight(1f).then(modifierForIconButton)) + Spacer(Modifier.weight(1f)) NextButton(player, Modifier.weight(1f).then(modifierForIconButton)) + Spacer(Modifier.weight(1f)) } } diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt index 4bd34ecb45..629cdaa626 100644 --- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt +++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt @@ -16,10 +16,10 @@ package androidx.media3.demo.compose.buttons +import androidx.compose.foundation.clickable import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.SkipNext import androidx.compose.material3.Icon -import androidx.compose.material3.IconButton import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.res.stringResource @@ -30,11 +30,9 @@ import androidx.media3.ui.compose.state.rememberNextButtonState @Composable internal fun NextButton(player: Player, modifier: Modifier = Modifier) { val state = rememberNextButtonState(player) - IconButton(onClick = state::onClick, modifier = modifier, enabled = state.isEnabled) { - Icon( - Icons.Default.SkipNext, - contentDescription = stringResource(R.string.next_button), - modifier = modifier, - ) - } + Icon( + Icons.Default.SkipNext, + contentDescription = stringResource(R.string.next_button), + modifier = modifier.clickable(enabled = state.isEnabled, onClick = state::onClick), + ) } diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt index cfa0a408e0..f14a78cca5 100644 --- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt +++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt @@ -16,11 +16,11 @@ package androidx.media3.demo.compose.buttons +import androidx.compose.foundation.clickable import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Pause import androidx.compose.material.icons.filled.PlayArrow import androidx.compose.material3.Icon -import androidx.compose.material3.IconButton import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.res.stringResource @@ -35,7 +35,9 @@ internal fun PlayPauseButton(player: Player, modifier: Modifier = Modifier) { val contentDescription = if (state.showPlay) stringResource(R.string.playpause_button_play) else stringResource(R.string.playpause_button_pause) - IconButton(onClick = state::onClick, modifier = modifier, enabled = state.isEnabled) { - Icon(icon, contentDescription = contentDescription, modifier = modifier) - } + Icon( + icon, + contentDescription = contentDescription, + modifier = modifier.clickable(enabled = state.isEnabled, onClick = state::onClick), + ) } diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt index 254d94f49f..f3e5e95595 100644 --- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt +++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt @@ -16,10 +16,10 @@ package androidx.media3.demo.compose.buttons +import androidx.compose.foundation.clickable import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.SkipPrevious import androidx.compose.material3.Icon -import androidx.compose.material3.IconButton import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.res.stringResource @@ -30,11 +30,9 @@ import androidx.media3.ui.compose.state.rememberPreviousButtonState @Composable internal fun PreviousButton(player: Player, modifier: Modifier = Modifier) { val state = rememberPreviousButtonState(player) - IconButton(onClick = state::onClick, modifier = modifier, enabled = state.isEnabled) { - Icon( - Icons.Default.SkipPrevious, - contentDescription = stringResource(R.string.previous_button), - modifier = modifier, - ) - } + Icon( + Icons.Default.SkipPrevious, + contentDescription = stringResource(R.string.previous_button), + modifier = modifier.clickable(enabled = state.isEnabled, onClick = state::onClick), + ) }