nick/amethyst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

fix(hls): lay rendition checkboxes out horizontally via FlowRow

Browse Source 
Five full-width rows eating half a screen was too much real estate for
a five-item toggle. Replace the fillMaxWidth stack with a FlowRow where
each item is a compact checkbox + short label ("360p", "540p", …),
wrapping to the next line on narrow screens.

The bitrate subline per rendition was cut — the values are public
library defaults anyway (360/540/720/1080/4K ladder) and the secondary
text was the biggest contributor to the vertical bloat. Above-source
rungs remain disabled; the grey-out on the checkbox + label is still
visible in the new layout.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
davotoula
2026-04-15 08:19:42 +02:00
parent 5a9298c603
commit d58dd4bcce
1 changed files with 23 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
amethyst/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedIn/video/hls/NewHlsVideoScreen.kt
+23 -32
View File
@@ -30,6 +30,7 @@ import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.FlowRow
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
@@ -439,17 +440,19 @@ private fun RenditionsCheckboxes(vm: NewHlsVideoViewModel) {
Spacer(Modifier.height(8.dp))
}
HlsLadder.default().renditions.forEach { rendition ->
val label = rendition.resolution.label
val aboveSource = sourceShortSide != null && rendition.resolution.shortSide > sourceShortSide
val enabled = !aboveSource
val checked = label in vm.selectedRenditionLabels && !aboveSource
FlowRow(
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalArrangement = Arrangement.spacedBy(4.dp),
) {
HlsLadder.default().renditions.forEach { rendition ->
val label = rendition.resolution.label
val aboveSource = sourceShortSide != null && rendition.resolution.shortSide > sourceShortSide
val enabled = !aboveSource
val checked = label in vm.selectedRenditionLabels && !aboveSource
Row(
modifier =
Modifier
.fillMaxWidth()
.clickable(enabled = enabled) {
Row(
modifier =
Modifier.clickable(enabled = enabled) {
vm.selectedRenditionLabels =
if (checked) {
vm.selectedRenditionLabels - label
@@ -457,34 +460,22 @@ private fun RenditionsCheckboxes(vm: NewHlsVideoViewModel) {
vm.selectedRenditionLabels + label
}
},
verticalAlignment = Alignment.CenterVertically,
) {
Checkbox(
checked = checked,
enabled = enabled,
onCheckedChange = {
vm.selectedRenditionLabels =
if (it) vm.selectedRenditionLabels + label else vm.selectedRenditionLabels - label
},
)
Column(modifier = Modifier.weight(1f)) {
verticalAlignment = Alignment.CenterVertically,
) {
Checkbox(
checked = checked,
enabled = enabled,
onCheckedChange = {
vm.selectedRenditionLabels =
if (it) vm.selectedRenditionLabels + label else vm.selectedRenditionLabels - label
},
)
Text(
text = label,
style = MaterialTheme.typography.bodyLarge,
color =
if (enabled) MaterialTheme.colorScheme.onSurface else MaterialTheme.colorScheme.onSurfaceVariant,
)
val subline =
if (aboveSource) {
stringResource(R.string.hls_rendition_above_source)
} else {
stringResource(R.string.hls_rendition_bitrate_kbps_format, rendition.bitrateKbps)
}
Text(
text = subline,
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}
}