mirror of
https://github.com/JustinZeus/Wholphin.git
synced 2026-07-08 23:51:21 +02:00
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:
parent
f4bdb8446e
commit
59ccce9d54
1 changed files with 44 additions and 24 deletions
|
|
@ -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,21 +213,38 @@ fun StreamLabel(
|
||||||
@Composable
|
@Composable
|
||||||
private fun StreamLabelPreview() {
|
private fun StreamLabelPreview() {
|
||||||
WholphinTheme(appThemeColors = AppThemeColors.PURPLE) {
|
WholphinTheme(appThemeColors = AppThemeColors.PURPLE) {
|
||||||
Row(
|
Column(
|
||||||
horizontalArrangement = Arrangement.spacedBy(8.dp),
|
verticalArrangement = Arrangement.spacedBy(16.dp),
|
||||||
modifier =
|
|
||||||
Modifier
|
|
||||||
.background(MaterialTheme.colorScheme.background)
|
|
||||||
.padding(8.dp),
|
|
||||||
) {
|
) {
|
||||||
StreamLabel("1080p")
|
Row(
|
||||||
StreamLabel("HDR")
|
horizontalArrangement = Arrangement.spacedBy(4.dp),
|
||||||
StreamLabel("H264")
|
modifier =
|
||||||
StreamLabel("AC3 5.1", icon = R.string.fa_volume_high, count = 2)
|
Modifier
|
||||||
|
.background(MaterialTheme.colorScheme.background)
|
||||||
|
.padding(8.dp),
|
||||||
|
) {
|
||||||
|
StreamLabel("1080p")
|
||||||
|
StreamLabel("HDR")
|
||||||
|
StreamLabel("H264")
|
||||||
|
StreamLabel("AC3 5.1", icon = R.string.fa_volume_high, count = 2)
|
||||||
|
|
||||||
StreamLabel("PGS", count = 1)
|
StreamLabel("PGS", count = 1)
|
||||||
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)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue