Fix small UI issue with long stream labels (#1388)

## Description
Fixes a small UI glitch when the subtitle label is too long, it would
slightly increase the high of the labels. This is especially noticeable
on series details if some episodes have the long label and some don't
because the episode row will bounce up and down a few pixels.

Also moves the labels closer together and changes "Disabled" to "None"
when subtitles are turned off.

### Related issues
None

### Testing
Emulator & compose previews

## Screenshots
### Before
The subtitle label is slightly taller than the others
<img width="528" height="36" alt="image"
src="https://github.com/user-attachments/assets/32d322bc-11cc-4238-840c-03ae41b069d3"
/>


### After
The ellipse doesn't look great, but there's limited space and looks
better than being cut off.
<img width="510" height="37" alt="image"
src="https://github.com/user-attachments/assets/40af707c-3121-40c0-a978-60781d9704d6"
/>


## AI or LLM usage
None
This commit is contained in:
Damontecres 2026-05-16 11:35:21 -04:00 committed by GitHub
parent f4bdb8446e
commit 59ccce9d54
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -3,7 +3,9 @@ package com.github.damontecres.wholphin.ui.components
import androidx.annotation.StringRes import androidx.annotation.StringRes
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.widthIn import androidx.compose.foundation.layout.widthIn
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
@ -69,7 +71,7 @@ fun VideoStreamDetails(
) { ) {
val context = LocalContext.current val context = LocalContext.current
Row( Row(
horizontalArrangement = Arrangement.spacedBy(8.dp), horizontalArrangement = Arrangement.spacedBy(4.dp),
modifier = modifier, modifier = modifier,
) { ) {
val video = val video =
@ -131,7 +133,7 @@ fun VideoStreamDetails(
remember(subtitleCount, subtitleStream) { remember(subtitleCount, subtitleStream) {
if (subtitleCount > 0 && subtitleStream == null) { if (subtitleCount > 0 && subtitleStream == null) {
disabled = true disabled = true
context.getString(R.string.disabled) context.getString(R.string.none)
} else if (subtitleCount == 0 || subtitleStream == null) { } else if (subtitleCount == 0 || subtitleStream == null) {
null null
} else { } else {
@ -188,20 +190,21 @@ fun StreamLabel(
modifier = Modifier, modifier = Modifier,
) )
} }
val string =
remember(text, disabled, count) {
val countToUse = if (disabled) count else count - 1
if (countToUse > 0) {
"$text (+$countToUse)"
} else {
text
}
}
Text( Text(
text = text, text = string,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis, overflow = TextOverflow.Ellipsis,
modifier = Modifier, modifier = Modifier,
) )
val countToUse = if (disabled) count else count - 1
if (countToUse > 0) {
Text(
text = "(+$countToUse)",
maxLines = 1,
modifier = Modifier,
)
}
} }
} }
} }
@ -210,8 +213,11 @@ fun StreamLabel(
@Composable @Composable
private fun StreamLabelPreview() { private fun StreamLabelPreview() {
WholphinTheme(appThemeColors = AppThemeColors.PURPLE) { WholphinTheme(appThemeColors = AppThemeColors.PURPLE) {
Column(
verticalArrangement = Arrangement.spacedBy(16.dp),
) {
Row( Row(
horizontalArrangement = Arrangement.spacedBy(8.dp), horizontalArrangement = Arrangement.spacedBy(4.dp),
modifier = modifier =
Modifier Modifier
.background(MaterialTheme.colorScheme.background) .background(MaterialTheme.colorScheme.background)
@ -226,5 +232,19 @@ private fun StreamLabelPreview() {
StreamLabel("PGS", count = 1, disabled = true) StreamLabel("PGS", count = 1, disabled = true)
StreamLabel("PGS", count = 2) StreamLabel("PGS", count = 2)
} }
Row(
horizontalArrangement = Arrangement.spacedBy(4.dp),
modifier =
Modifier
.background(MaterialTheme.colorScheme.background)
.padding(8.dp)
.fillMaxWidth(.7f),
) {
StreamLabel("1080p")
StreamLabel("HDR")
StreamLabel("English Dolby Atmos 5.1", icon = R.string.fa_volume_high, count = 2)
StreamLabel("English SDH SRT", icon = R.string.fa_closed_captioning, count = 35)
}
}
} }
} }