From 4c530f1c36adb14725892f9ea8e1021d257c0fc3 Mon Sep 17 00:00:00 2001
From: PartyDonut <PartyDonut@users.noreply.github.com>
Date: Wed, 22 Oct 2025 19:29:22 +0200
Subject: [PATCH] fix: Progress bar changing width when scrubbing

---
 .../jknaapen/fladder/VideoPlayerActivity.kt   |  2 +-
 .../composables/controls/ProgressBar.kt       | 26 ++++++++++++++-----
 .../jknaapen/fladder/utility/ScaledContent.kt |  2 --
 .../nl/jknaapen/fladder/utility/TextWidth.kt  | 14 ++++++++++
 4 files changed, 34 insertions(+), 10 deletions(-)
 create mode 100644 android/app/src/main/kotlin/nl/jknaapen/fladder/utility/TextWidth.kt

diff --git a/android/app/src/main/kotlin/nl/jknaapen/fladder/VideoPlayerActivity.kt b/android/app/src/main/kotlin/nl/jknaapen/fladder/VideoPlayerActivity.kt
index 2f98816..dd4e000 100644
--- a/android/app/src/main/kotlin/nl/jknaapen/fladder/VideoPlayerActivity.kt
+++ b/android/app/src/main/kotlin/nl/jknaapen/fladder/VideoPlayerActivity.kt
@@ -52,7 +52,7 @@ fun VideoPlayerScreen(
 ) {
     val leanBackEnabled = leanBackEnabled(LocalContext.current)
     ExoPlayer { player ->
-        ScaledContent(if (leanBackEnabled) 0.75f else 1f) {
+        ScaledContent(if (leanBackEnabled) 0.65f else 1f) {
             CustomVideoControls(player)
         }
     }
diff --git a/android/app/src/main/kotlin/nl/jknaapen/fladder/composables/controls/ProgressBar.kt b/android/app/src/main/kotlin/nl/jknaapen/fladder/composables/controls/ProgressBar.kt
index 343f21d..e574563 100644
--- a/android/app/src/main/kotlin/nl/jknaapen/fladder/composables/controls/ProgressBar.kt
+++ b/android/app/src/main/kotlin/nl/jknaapen/fladder/composables/controls/ProgressBar.kt
@@ -23,6 +23,7 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.widthIn
 import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
@@ -62,6 +63,7 @@ import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.layout.onGloballyPositioned
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.util.fastCoerceIn
 import androidx.media3.exoplayer.ExoPlayer
@@ -71,6 +73,7 @@ import nl.jknaapen.fladder.objects.Translate
 import nl.jknaapen.fladder.objects.VideoPlayerObject
 import nl.jknaapen.fladder.utility.capitalize
 import nl.jknaapen.fladder.utility.formatTime
+import nl.jknaapen.fladder.utility.measureTextWidth
 import kotlin.math.max
 import kotlin.math.min
 import kotlin.time.Duration
@@ -135,7 +138,7 @@ internal fun ProgressBar(
                 if (label.isNotBlank()) {
                     Text(
                         text = label,
-                        style = MaterialTheme.typography.bodyLarge.copy(
+                        style = MaterialTheme.typography.titleLarge.copy(
                             color = Color.White,
                             fontWeight = FontWeight.Bold
                         ),
@@ -156,12 +159,20 @@ internal fun ProgressBar(
             verticalAlignment = Alignment.CenterVertically,
             modifier = modifier.fillMaxWidth()
         ) {
+            val timeTextStyle = MaterialTheme.typography.titleLarge.copy(
+                fontWeight = FontWeight.Bold
+            )
+
+            //Calculate min width to stop resizing of progressbar
+            val textWidth = measureTextWidth("-" + formatTime(duration), timeTextStyle)
+
             Text(
                 formatTime(currentPosition),
                 color = Color.White,
-                style = MaterialTheme.typography.bodyLarge.copy(
-                    fontWeight = FontWeight.Bold
-                )
+                modifier = Modifier.widthIn(min = textWidth),
+                textAlign = TextAlign.Start,
+                maxLines = 1,
+                style = timeTextStyle
             )
             SimpleProgressBar(
                 player,
@@ -184,9 +195,10 @@ internal fun ProgressBar(
                     )
                 ),
                 color = Color.White,
-                style = MaterialTheme.typography.bodyLarge.copy(
-                    fontWeight = FontWeight.Bold
-                )
+                textAlign = TextAlign.End,
+                modifier = Modifier.widthIn(min = textWidth),
+                maxLines = 1,
+                style = timeTextStyle
             )
         }
     }
diff --git a/android/app/src/main/kotlin/nl/jknaapen/fladder/utility/ScaledContent.kt b/android/app/src/main/kotlin/nl/jknaapen/fladder/utility/ScaledContent.kt
index e039300..fb5e07b 100644
--- a/android/app/src/main/kotlin/nl/jknaapen/fladder/utility/ScaledContent.kt
+++ b/android/app/src/main/kotlin/nl/jknaapen/fladder/utility/ScaledContent.kt
@@ -11,11 +11,9 @@ fun ScaledContent(
     content: @Composable () -> Unit
 ) {
     val density = LocalDensity.current
-    val fontScale = 1f / scale
     CompositionLocalProvider(
         LocalDensity provides Density(
             density = density.density * scale,
-            fontScale = fontScale
         )
     ) {
         content()
diff --git a/android/app/src/main/kotlin/nl/jknaapen/fladder/utility/TextWidth.kt b/android/app/src/main/kotlin/nl/jknaapen/fladder/utility/TextWidth.kt
new file mode 100644
index 0000000..51852a6
--- /dev/null
+++ b/android/app/src/main/kotlin/nl/jknaapen/fladder/utility/TextWidth.kt
@@ -0,0 +1,14 @@
+package nl.jknaapen.fladder.utility
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.rememberTextMeasurer
+import androidx.compose.ui.unit.Dp
+
+@Composable
+fun measureTextWidth(text: String, style: TextStyle): Dp {
+    val textMeasurer = rememberTextMeasurer()
+    val widthInPixels = textMeasurer.measure(text, style).size.width
+    return with(LocalDensity.current) { widthInPixels.toDp() }
+}
\ No newline at end of file