fix(tv): update TvIconButton size and refactor layout for consistency

This commit is contained in:
2026-05-02 11:13:15 +02:00
parent 58087bb4a5
commit 65693a9220
2 changed files with 57 additions and 55 deletions

View File

@@ -6,7 +6,6 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
@@ -55,22 +54,21 @@ internal fun TvIconButton(
targetValue = if (isFocused) scheme.primary else Color.Transparent,
label = "border"
)
val shape = RoundedCornerShape(50)
val iconSize = (size - 24).coerceAtLeast(0).dp
Box(
modifier = modifier
val buttonModifier = modifier
.graphicsLayer {
scaleX = scale
scaleY = scale
}
.alpha(if (enabled) 1f else 0.4f)
.widthIn(min = if (label == null) size.dp else 104.dp)
.height(size.dp)
.border(
width = if (isFocused) 2.dp else 0.dp,
color = borderColor,
shape = RoundedCornerShape(50)
shape = shape
)
.clip(RoundedCornerShape(50))
.clip(shape)
.background(
if (isFocused) scheme.primary.copy(alpha = 0.5f)
else scheme.background.copy(alpha = 0.65f)
@@ -82,27 +80,32 @@ internal fun TvIconButton(
}
}
.onFocusChanged { isFocused = it.isFocused }
.clickable(enabled = enabled) { onClick() },
contentAlignment = Alignment.Center
) {
.clickable(enabled = enabled) { onClick() }
if (label == null) {
Icon(
imageVector = icon,
contentDescription = contentDescription,
tint = scheme.onBackground,
modifier = Modifier.padding(8.dp)
modifier = buttonModifier
.size(size.dp)
.padding(12.dp)
.size(iconSize)
)
} else {
Row(
horizontalArrangement = Arrangement.spacedBy(6.dp),
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.padding(horizontal = 16.dp)
modifier = buttonModifier
.widthIn(min = 104.dp)
.height(size.dp)
.padding(horizontal = 16.dp)
) {
Icon(
imageVector = icon,
contentDescription = contentDescription,
tint = scheme.onBackground,
modifier = Modifier.size(28.dp)
modifier = Modifier.size(iconSize)
)
Text(
text = label,
@@ -113,4 +116,3 @@ internal fun TvIconButton(
}
}
}
}

View File

@@ -258,21 +258,21 @@ private fun TvPlayerBottomSection(
icon = Icons.Outlined.SkipPrevious,
contentDescription = "Previous",
onClick = onPrevious,
size = 64,
size = 56,
modifier = expandPlaylistModifier
)
TvIconButton(
icon = Icons.Outlined.Replay10,
contentDescription = "Seek backward 10 seconds",
onClick = { onSeekRelative(-10_000) },
size = 64,
size = 56,
modifier = expandPlaylistModifier
)
TvIconButton(
icon = if (uiState.isPlaying) Icons.Outlined.Pause else Icons.Outlined.PlayArrow,
contentDescription = if (uiState.isPlaying) "Pause" else "Play",
onClick = onPlayPause,
size = 72,
size = 64,
modifier = expandPlaylistModifier
.focusRequester(focusRequester)
.testTag(TvPlayerPlayPauseButtonTag)
@@ -281,14 +281,14 @@ private fun TvPlayerBottomSection(
icon = Icons.Outlined.Forward30,
contentDescription = "Seek forward 30 seconds",
onClick = { onSeekRelative(30_000) },
size = 64,
size = 56,
modifier = expandPlaylistModifier
)
TvIconButton(
icon = Icons.Outlined.SkipNext,
contentDescription = "Next",
onClick = onNext,
size = 64,
size = 56,
modifier = expandPlaylistModifier
)
}