From 032f2908637d5356d2efe75e5465276d6a33d0d7 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 10:25:06 +0100
Subject: [PATCH 01/17] Upgrade to AGP 8.7.1

---
 .idea/compiler.xml                           |  2 +-
 .idea/gradle.xml                             |  1 +
 .idea/inspectionProfiles/Project_Default.xml | 29 ++++++++++++++++++++
 .idea/misc.xml                               |  3 +-
 gradle/libs.versions.toml                    |  2 +-
 gradle/wrapper/gradle-wrapper.properties     |  2 +-
 6 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/.idea/compiler.xml b/.idea/compiler.xml
index b589d56..b86273d 100644
--- a/.idea/compiler.xml
+++ b/.idea/compiler.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
   <component name="CompilerConfiguration">
-    <bytecodeTargetLevel target="17" />
+    <bytecodeTargetLevel target="21" />
   </component>
 </project>
\ No newline at end of file
diff --git a/.idea/gradle.xml b/.idea/gradle.xml
index 0361dc2..b7890c1 100644
--- a/.idea/gradle.xml
+++ b/.idea/gradle.xml
@@ -4,6 +4,7 @@
   <component name="GradleSettings">
     <option name="linkedExternalProjectsSettings">
       <GradleProjectSettings>
+        <option name="testRunner" value="CHOOSE_PER_TEST" />
         <option name="externalProjectPath" value="$PROJECT_DIR$" />
         <option name="gradleJvm" value="#GRADLE_LOCAL_JAVA_HOME" />
         <option name="modules">
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
index 44ca2d9..0e2c636 100644
--- a/.idea/inspectionProfiles/Project_Default.xml
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -1,6 +1,35 @@
 <component name="InspectionProjectProfileManager">
   <profile version="1.0">
     <option name="myName" value="Project Default" />
+    <inspection_tool class="AndroidLintUnsafeImplicitIntentLaunch" enabled="false" level="ERROR" enabled_by_default="false" />
+    <inspection_tool class="ComposePreviewDimensionRespectsLimit" enabled="true" level="WARNING" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="ComposePreviewMustBeTopLevelFunction" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="ComposePreviewNeedsComposableAnnotation" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="ComposePreviewNotSupportedInUnitTestFiles" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+      <option name="previewFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewDimensionRespectsLimit" enabled="true" level="WARNING" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewMustBeTopLevelFunction" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewNeedsComposableAnnotation" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
+    <inspection_tool class="GlancePreviewNotSupportedInUnitTestFiles" enabled="true" level="ERROR" enabled_by_default="true">
+      <option name="composableFile" value="true" />
+    </inspection_tool>
     <inspection_tool class="PreviewAnnotationInFunctionWithParameters" enabled="true" level="ERROR" enabled_by_default="true">
       <option name="composableFile" value="true" />
       <option name="previewFile" value="true" />
diff --git a/.idea/misc.xml b/.idea/misc.xml
index 8978d23..74dd639 100644
--- a/.idea/misc.xml
+++ b/.idea/misc.xml
@@ -1,6 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
   <component name="ExternalStorageConfigurationManager" enabled="true" />
-  <component name="ProjectRootManager" version="2" languageLevel="JDK_17" default="true" project-jdk-name="jbr-17" project-jdk-type="JavaSDK">
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_21" default="true" project-jdk-name="jbr-21" project-jdk-type="JavaSDK">
     <output url="file://$PROJECT_DIR$/build/classes" />
   </component>
   <component name="ProjectType">
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
index 24635de..806958f 100644
--- a/gradle/libs.versions.toml
+++ b/gradle/libs.versions.toml
@@ -1,5 +1,5 @@
 [versions]
-gradle = "8.5.2"
+gradle = "8.7.1"
 kotlin-gradle-plugin = "1.9.25"
 ktx = "1.13.1"
 lifecycle-compose = "2.8.5"
diff --git a/gradle/wrapper/gradle-wrapper.properties b/gradle/wrapper/gradle-wrapper.properties
index 544b5ee..af7bb21 100644
--- a/gradle/wrapper/gradle-wrapper.properties
+++ b/gradle/wrapper/gradle-wrapper.properties
@@ -1,6 +1,6 @@
 #Mon Nov 20 16:01:06 CET 2023
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.7-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.9-bin.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

From b1a6fc74e2a71239c01f029e56c77a4a759b65c7 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 10:59:07 +0100
Subject: [PATCH 02/17] Update dependencies

---
 gradle/libs.versions.toml | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
index 806958f..78c899b 100644
--- a/gradle/libs.versions.toml
+++ b/gradle/libs.versions.toml
@@ -1,19 +1,19 @@
 [versions]
 gradle = "8.7.1"
 kotlin-gradle-plugin = "1.9.25"
-ktx = "1.13.1"
-lifecycle-compose = "2.8.5"
-activity-compose = "1.9.2"
+ktx = "1.15.0"
+lifecycle-compose = "2.8.7"
+activity-compose = "1.9.3"
 appcompat = "1.7.0"
-compose-bom = "2024.09.00"
+compose-bom = "2024.10.01"
 junit4 = "4.13.2"
 playServices-castFramework = "21.5.0"
-ui-test-junit4 = "1.7.0" # ...not in BOM for some reason?
+ui-test-junit4 = "1.7.5" # ...not in BOM for some reason?
 androidx-junit = "1.2.1"
 androidx-espresso = "3.6.1"
 androidx-mediarouter = "1.7.0"
 dokka = "1.9.20"
-theoplayer = "8.2.0"
+theoplayer = "8.3.0"
 
 [libraries]
 androidx-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "ktx" }

From d4e7c7fe21a4c54548c21e92f1130f02eef9f938 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 11:06:12 +0100
Subject: [PATCH 03/17] Set compileSdk to 35

---
 app/build.gradle.kts | 2 +-
 ui/build.gradle.kts  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/build.gradle.kts b/app/build.gradle.kts
index 39f2529..2171f3b 100644
--- a/app/build.gradle.kts
+++ b/app/build.gradle.kts
@@ -5,7 +5,7 @@ plugins {
 
 android {
     namespace = "com.theoplayer.android.ui.demo"
-    compileSdk = 34
+    compileSdk = 35
 
     defaultConfig {
         applicationId = "com.theoplayer.android.ui.demo"
diff --git a/ui/build.gradle.kts b/ui/build.gradle.kts
index 5063c67..ad91e3d 100644
--- a/ui/build.gradle.kts
+++ b/ui/build.gradle.kts
@@ -20,7 +20,7 @@ plugins {
 
 android {
     namespace = "com.theoplayer.android.ui"
-    compileSdk = 34
+    compileSdk = 35
 
     defaultConfig {
         minSdk = 21

From 3fe31d0d12d6525da84a89bd3119be8abc090a24 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 11:24:39 +0100
Subject: [PATCH 04/17] Add iconModifier to all button and icon components

---
 .../java/com/theoplayer/android/ui/ChromecastButton.kt   | 5 +++++
 .../main/java/com/theoplayer/android/ui/ErrorDisplay.kt  | 9 +++++++--
 .../java/com/theoplayer/android/ui/FullscreenButton.kt   | 4 ++++
 .../java/com/theoplayer/android/ui/LanguageMenuButton.kt | 3 +++
 ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt | 9 +++++++--
 ui/src/main/java/com/theoplayer/android/ui/MuteButton.kt | 4 ++++
 ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt | 5 ++++-
 .../java/com/theoplayer/android/ui/SettingsMenuButton.kt | 3 +++
 8 files changed, 37 insertions(+), 5 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/ChromecastButton.kt b/ui/src/main/java/com/theoplayer/android/ui/ChromecastButton.kt
index 935999d..07f277f 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/ChromecastButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/ChromecastButton.kt
@@ -15,6 +15,7 @@ import com.theoplayer.android.api.cast.chromecast.PlayerCastState
  * A button to start and stop casting using Chromecast.
  *
  * @param modifier the [Modifier] to be applied to this button
+ * @param iconModifier the [Modifier] to be applied to the [Icon]s inside this button
  * @param contentPadding the spacing values to apply internally between the container and the
  * content
  * @param availableIcon button content when Chromecast is available but not connected,
@@ -27,22 +28,26 @@ import com.theoplayer.android.api.cast.chromecast.PlayerCastState
 @Composable
 fun ChromecastButton(
     modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
     contentPadding: PaddingValues = PaddingValues(0.dp),
     availableIcon: @Composable () -> Unit = {
         Icon(
             Icons.Rounded.Cast,
+            modifier = iconModifier,
             contentDescription = "Start casting"
         )
     },
     connectingIcon: @Composable () -> Unit = {
         Icon(
             Icons.Rounded.Cast,
+            modifier = iconModifier,
             contentDescription = "Stop casting"
         )
     },
     connectedIcon: @Composable () -> Unit = {
         Icon(
             Icons.Rounded.CastConnected,
+            modifier = iconModifier,
             contentDescription = "Stop casting"
         )
     }
diff --git a/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt b/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt
index edcedd4..e1c4e3f 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt
@@ -14,16 +14,21 @@ import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 
 /**
  * A display for a fatal error, if the player encounters one.
  *
  * @param modifier the [Modifier] to be applied to this display
+ * @param iconModifier the [Modifier] to be applied to the [Icon]s inside this button
+ * @param iconSize the size of the icons
  */
 @Composable
 fun ErrorDisplay(
     modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
+    iconSize: Dp = 48.dp,
 ) {
     Player.current?.error?.let { error ->
         Row(
@@ -33,13 +38,13 @@ fun ErrorDisplay(
             Column {
                 Icon(
                     Icons.Rounded.Error,
-                    modifier = Modifier.size(48.dp),
+                    modifier = Modifier.size(iconSize).then(iconModifier),
                     contentDescription = null
                 )
             }
             Column {
                 Box(
-                    modifier = Modifier.defaultMinSize(minHeight = 48.dp),
+                    modifier = Modifier.defaultMinSize(minHeight = iconSize),
                     contentAlignment = Alignment.CenterStart
                 ) {
                     Text(
diff --git a/ui/src/main/java/com/theoplayer/android/ui/FullscreenButton.kt b/ui/src/main/java/com/theoplayer/android/ui/FullscreenButton.kt
index 5863fdd..a859f38 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/FullscreenButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/FullscreenButton.kt
@@ -13,6 +13,7 @@ import androidx.compose.ui.unit.dp
  * A button that toggles fullscreen.
  *
  * @param modifier the [Modifier] to be applied to this button
+ * @param iconModifier the [Modifier] to be applied to the [Icon]s inside this button
  * @param contentPadding the spacing values to apply internally between the container and the
  * content
  * @param enter button content when the player is not fullscreen, typically an "enter fullscreen" icon
@@ -21,16 +22,19 @@ import androidx.compose.ui.unit.dp
 @Composable
 fun FullscreenButton(
     modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
     contentPadding: PaddingValues = PaddingValues(0.dp),
     enter: @Composable () -> Unit = {
         Icon(
             Icons.Rounded.Fullscreen,
+            modifier = iconModifier,
             contentDescription = "Enter fullscreen"
         )
     },
     exit: @Composable () -> Unit = {
         Icon(
             Icons.Rounded.FullscreenExit,
+            modifier = iconModifier,
             contentDescription = "Exit fullscreen"
         )
     }
diff --git a/ui/src/main/java/com/theoplayer/android/ui/LanguageMenuButton.kt b/ui/src/main/java/com/theoplayer/android/ui/LanguageMenuButton.kt
index 99f5836..f86c02e 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/LanguageMenuButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/LanguageMenuButton.kt
@@ -11,16 +11,19 @@ import androidx.compose.ui.unit.dp
  * A button that opens the [language menu][LanguageMenu].
  *
  * @param modifier the [Modifier] to be applied to this button
+ * @param iconModifier the [Modifier] to be applied to the [Icon] inside this button
  * @param contentPadding the spacing values to apply internally between the container and the
  * content
  */
 @Composable
 fun MenuScope.LanguageMenuButton(
     modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
     contentPadding: PaddingValues = PaddingValues(0.dp),
     content: @Composable () -> Unit = {
         Icon(
             painter = painterResource(id = R.drawable.language),
+            modifier = iconModifier,
             contentDescription = "Language"
         )
     }
diff --git a/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt b/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt
index ca1d1c3..984511d 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt
@@ -14,6 +14,7 @@ import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import com.theoplayer.android.ui.theme.THEOplayerTheme
 
@@ -22,6 +23,8 @@ import com.theoplayer.android.ui.theme.THEOplayerTheme
  * and seeks to the live point when clicked.
  *
  * @param modifier the [Modifier] to be applied to this button
+ * @param iconModifier the [Modifier] to be applied to the [Icon] inside this button
+ * @param iconSize the size of the icon
  * @param contentPadding the spacing values to apply internally between the container and the
  * content
  * @param colors [ButtonColors] that will be used to resolve the colors for this button in different
@@ -36,13 +39,15 @@ import com.theoplayer.android.ui.theme.THEOplayerTheme
 @Composable
 fun LiveButton(
     modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
+    iconSize: Dp = 12.dp,
     contentPadding: PaddingValues = ButtonDefaults.TextButtonContentPadding,
     colors: IconButtonColors = IconButtonDefaults.iconButtonColors(),
     liveThreshold: Double = 10.0,
     live: @Composable RowScope.() -> Unit = {
         Icon(
             Icons.Rounded.Circle,
-            modifier = Modifier.size(12.dp),
+            modifier = Modifier.size(iconSize).then(iconModifier),
             tint = THEOplayerTheme.playerColors.liveButtonLive,
             contentDescription = null
         )
@@ -51,7 +56,7 @@ fun LiveButton(
     dvr: @Composable RowScope. () -> Unit = {
         Icon(
             Icons.Rounded.Circle,
-            modifier = Modifier.size(12.dp),
+            modifier = Modifier.size(iconSize).then(iconModifier),
             tint = THEOplayerTheme.playerColors.liveButtonDvr,
             contentDescription = null
         )
diff --git a/ui/src/main/java/com/theoplayer/android/ui/MuteButton.kt b/ui/src/main/java/com/theoplayer/android/ui/MuteButton.kt
index aad606a..4c116ee 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/MuteButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/MuteButton.kt
@@ -13,6 +13,7 @@ import androidx.compose.ui.unit.dp
  * A button that toggles whether audio is muted or not.
  *
  * @param modifier the [Modifier] to be applied to this button
+ * @param iconModifier the [Modifier] to be applied to the [Icon]s inside this button
  * @param contentPadding the spacing values to apply internally between the container and the
  * content
  * @param mute button content when the player is unmuted, typically a "mute" icon
@@ -21,16 +22,19 @@ import androidx.compose.ui.unit.dp
 @Composable
 fun MuteButton(
     modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
     contentPadding: PaddingValues = PaddingValues(0.dp),
     mute: @Composable () -> Unit = {
         Icon(
             Icons.AutoMirrored.Rounded.VolumeUp,
+            modifier = iconModifier,
             contentDescription = "Mute"
         )
     },
     unmute: @Composable () -> Unit = {
         Icon(
             Icons.AutoMirrored.Rounded.VolumeOff,
+            modifier = iconModifier,
             contentDescription = "Unmute"
         )
     }
diff --git a/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt b/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt
index 209d77f..1cef89d 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt
@@ -27,6 +27,7 @@ import kotlin.math.absoluteValue
  * @param modifier the [Modifier] to be applied to this button
  * @param seekOffset the offset (in seconds) by which to seek forward (if positive)
  * or backward (if negative)
+ * @param iconModifier the [Modifier] to be applied to the [Icon] inside this button
  * @param iconSize the size of the icon
  * @param contentPadding the spacing values to apply internally between the container and the
  * content
@@ -35,6 +36,7 @@ import kotlin.math.absoluteValue
 fun SeekButton(
     modifier: Modifier = Modifier,
     seekOffset: Int = 10,
+    iconModifier: Modifier = Modifier,
     iconSize: Dp = 24.dp,
     contentPadding: PaddingValues = PaddingValues(0.dp)
 ) {
@@ -48,7 +50,8 @@ fun SeekButton(
                 Icons.Rounded.Replay,
                 modifier = Modifier
                     .size(iconSize)
-                    .scale(scaleX = if (seekOffset >= 0) -1f else 1f, scaleY = 1f),
+                    .scale(scaleX = if (seekOffset >= 0) -1f else 1f, scaleY = 1f)
+                    .then(iconModifier),
                 contentDescription = if (seekOffset >= 0) {
                     "Seek forward by $seekOffset seconds"
                 } else {
diff --git a/ui/src/main/java/com/theoplayer/android/ui/SettingsMenuButton.kt b/ui/src/main/java/com/theoplayer/android/ui/SettingsMenuButton.kt
index e9f92d2..4a478ab 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/SettingsMenuButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/SettingsMenuButton.kt
@@ -12,16 +12,19 @@ import androidx.compose.ui.unit.dp
  * A button that opens the [settings menu][SettingsMenu].
  *
  * @param modifier the [Modifier] to be applied to this button
+ * @param iconModifier the [Modifier] to be applied to the [Icon] inside this button
  * @param contentPadding the spacing values to apply internally between the container and the
  * content
  */
 @Composable
 fun MenuScope.SettingsMenuButton(
     modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
     contentPadding: PaddingValues = PaddingValues(0.dp),
     content: @Composable () -> Unit = {
         Icon(
             Icons.Rounded.Settings,
+            modifier = iconModifier,
             contentDescription = "Settings"
         )
     }

From 650df9d35a7d024b158acdb0a9be526050d9ef90 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 11:38:25 +0100
Subject: [PATCH 05/17] Add controlsVisible param to UIController

---
 .../com/theoplayer/android/ui/UIController.kt | 38 +++++++++++--------
 1 file changed, 23 insertions(+), 15 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/UIController.kt b/ui/src/main/java/com/theoplayer/android/ui/UIController.kt
index 7385215..30651f1 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/UIController.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/UIController.kt
@@ -72,6 +72,8 @@ import kotlin.time.DurationUnit
  * for this container. You can create and pass in your own `remember`ed instance to observe
  * [Interaction]s and customize the behavior of this container.
  * @param color the background color for the overlay while showing the UI controls
+ * @param controlsVisible whether the player controls should be visible.
+ * If unset, the controls automatically hide when inactive and show when tapped or paused.
  * @param centerOverlay content to show in the center of the player, typically a [LoadingSpinner].
  * @param errorOverlay content to show when the player encountered a fatal error,
  * typically an [ErrorDisplay].
@@ -87,6 +89,7 @@ fun UIController(
     source: SourceDescription? = null,
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
     color: Color = Color.Black,
+    controlsVisible: Boolean? = null,
     centerOverlay: (@Composable UIControllerScope.() -> Unit)? = null,
     errorOverlay: (@Composable UIControllerScope.() -> Unit)? = null,
     topChrome: (@Composable UIControllerScope.() -> Unit)? = null,
@@ -103,6 +106,7 @@ fun UIController(
         player = player,
         interactionSource = interactionSource,
         color = color,
+        controlsVisible = controlsVisible,
         centerOverlay = centerOverlay,
         errorOverlay = errorOverlay,
         topChrome = topChrome,
@@ -124,6 +128,8 @@ fun UIController(
  * for this container. You can create and pass in your own `remember`ed instance to observe
  * [Interaction]s and customize the behavior of this container.
  * @param color the background color for the overlay while showing the UI controls
+ * @param controlsVisible whether the player controls should be visible.
+ * If unset, the controls automatically hide when inactive and show when tapped or paused.
  * @param centerOverlay content to show in the center of the player, typically a [LoadingSpinner].
  * @param errorOverlay content to show when the player encountered a fatal error,
  * typically an [ErrorDisplay].
@@ -138,6 +144,7 @@ fun UIController(
     player: Player = rememberPlayer(),
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
     color: Color = Color.Black,
+    controlsVisible: Boolean? = null,
     centerOverlay: (@Composable UIControllerScope.() -> Unit)? = null,
     errorOverlay: (@Composable UIControllerScope.() -> Unit)? = null,
     topChrome: (@Composable UIControllerScope.() -> Unit)? = null,
@@ -164,19 +171,20 @@ fun UIController(
         isReady = true
     }
 
-    val controlsVisible = remember {
+    val currentControlsVisible = remember {
         derivedStateOf {
-            if (!isReady) {
-                false
-            } else if (!player.firstPlay || player.castState == PlayerCastState.CONNECTED) {
-                true
-            } else if (player.playingAd) {
-                false
-            } else if (forceControlsHidden) {
-                false
-            } else {
-                isRecentlyTapped || isPressed || player.paused
-            }
+            controlsVisible
+                ?: if (!isReady) {
+                    false
+                } else if (!player.firstPlay || player.castState == PlayerCastState.CONNECTED) {
+                    true
+                } else if (player.playingAd) {
+                    false
+                } else if (forceControlsHidden) {
+                    false
+                } else {
+                    isRecentlyTapped || isPressed || player.paused
+                }
         }
     }
 
@@ -195,7 +203,7 @@ fun UIController(
         }
     }
     val backgroundVisible = if (uiState is UIState.Controls) {
-        controlsVisible.value
+        currentControlsVisible.value
     } else {
         true
     }
@@ -228,7 +236,7 @@ fun UIController(
                     .background(background)
                     .pressable(interactionSource = interactionSource, requireUnconsumed = false)
                     .toggleControlsOnTap(
-                        controlsVisible = controlsVisible,
+                        controlsVisible = currentControlsVisible,
                         showControlsTemporarily = {
                             forceControlsHidden = false
                             tapCount++
@@ -274,7 +282,7 @@ fun UIController(
 
                     is UIState.Controls -> {
                         scope.PlayerControls(
-                            controlsVisible = controlsVisible.value,
+                            controlsVisible = currentControlsVisible.value,
                             animationsActive = isReady && !player.playingAd,
                             centerOverlay = centerOverlay,
                             topChrome = topChrome,

From 87fb94a0b0827143ddbbcb0c6814aa6260bc084b Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 11:44:29 +0100
Subject: [PATCH 06/17] Use infix then

---
 .../com/theoplayer/android/ui/ErrorDisplay.kt  |  2 +-
 .../com/theoplayer/android/ui/LiveButton.kt    |  4 ++--
 .../com/theoplayer/android/ui/Modifiers.kt     | 18 ++++++++----------
 3 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt b/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt
index e1c4e3f..f16f696 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/ErrorDisplay.kt
@@ -38,7 +38,7 @@ fun ErrorDisplay(
             Column {
                 Icon(
                     Icons.Rounded.Error,
-                    modifier = Modifier.size(iconSize).then(iconModifier),
+                    modifier = Modifier.size(iconSize) then iconModifier,
                     contentDescription = null
                 )
             }
diff --git a/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt b/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt
index 984511d..ec87c4f 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/LiveButton.kt
@@ -47,7 +47,7 @@ fun LiveButton(
     live: @Composable RowScope.() -> Unit = {
         Icon(
             Icons.Rounded.Circle,
-            modifier = Modifier.size(iconSize).then(iconModifier),
+            modifier = Modifier.size(iconSize) then iconModifier,
             tint = THEOplayerTheme.playerColors.liveButtonLive,
             contentDescription = null
         )
@@ -56,7 +56,7 @@ fun LiveButton(
     dvr: @Composable RowScope. () -> Unit = {
         Icon(
             Icons.Rounded.Circle,
-            modifier = Modifier.size(iconSize).then(iconModifier),
+            modifier = Modifier.size(iconSize) then iconModifier,
             tint = THEOplayerTheme.playerColors.liveButtonDvr,
             contentDescription = null
         )
diff --git a/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt b/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt
index 0ca2542..4c05ae6 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt
@@ -182,16 +182,14 @@ internal fun Modifier.constrainedAspectRatio(
     @FloatRange(from = 0.0, fromInclusive = false)
     ratio: Float,
     matchHeightConstraintsFirst: Boolean = false
-): Modifier = this.then(
-    ConstrainedAspectRatioElement(
-        ratio,
-        matchHeightConstraintsFirst,
-        debugInspectorInfo {
-            name = "constrainedAspectRatio"
-            properties["ratio"] = ratio
-            properties["matchHeightConstraintsFirst"] = matchHeightConstraintsFirst
-        }
-    )
+): Modifier = this then ConstrainedAspectRatioElement(
+    ratio,
+    matchHeightConstraintsFirst,
+    debugInspectorInfo {
+        name = "constrainedAspectRatio"
+        properties["ratio"] = ratio
+        properties["matchHeightConstraintsFirst"] = matchHeightConstraintsFirst
+    }
 )
 
 private class ConstrainedAspectRatioElement(

From 1e82446516bb48be0d17001b807b9ab94fe383a7 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 11:58:02 +0100
Subject: [PATCH 07/17] Reduce extra space below seek bar

---
 .../com/theoplayer/android/ui/demo/nitflex/NitflexUI.kt   | 8 +++++++-
 ui/src/main/java/com/theoplayer/android/ui/DefaultUI.kt   | 8 +++++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/app/src/main/java/com/theoplayer/android/ui/demo/nitflex/NitflexUI.kt b/app/src/main/java/com/theoplayer/android/ui/demo/nitflex/NitflexUI.kt
index 39520cb..fe2874b 100644
--- a/app/src/main/java/com/theoplayer/android/ui/demo/nitflex/NitflexUI.kt
+++ b/app/src/main/java/com/theoplayer/android/ui/demo/nitflex/NitflexUI.kt
@@ -18,6 +18,7 @@ import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ProvideTextStyle
 import androidx.compose.material3.Text
 import androidx.compose.material3.TextButton
+import androidx.compose.material3.minimumInteractiveComponentSize
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Alignment
@@ -120,7 +121,12 @@ fun NitflexUI(
                         modifier = Modifier.fillMaxWidth(),
                         verticalAlignment = Alignment.CenterVertically
                     ) {
-                        NitflexSeekBar(modifier = Modifier.weight(1f))
+                        Box(
+                            modifier = Modifier.weight(1f).minimumInteractiveComponentSize(),
+                            contentAlignment = Alignment.CenterStart
+                        ) {
+                            NitflexSeekBar()
+                        }
                         CurrentTimeDisplay(showRemaining = true)
                     }
                     Row(
diff --git a/ui/src/main/java/com/theoplayer/android/ui/DefaultUI.kt b/ui/src/main/java/com/theoplayer/android/ui/DefaultUI.kt
index f433613..e72b684 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/DefaultUI.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/DefaultUI.kt
@@ -7,6 +7,7 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.material3.Text
+import androidx.compose.material3.minimumInteractiveComponentSize
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Alignment
@@ -107,7 +108,12 @@ fun DefaultUI(
             if (player.firstPlay) {
                 ChromecastDisplay(modifier = Modifier.padding(8.dp))
                 if (player.streamType != StreamType.Live) {
-                    SeekBar()
+                    Box(
+                        modifier = Modifier.minimumInteractiveComponentSize(),
+                        contentAlignment = Alignment.CenterStart
+                    ) {
+                        SeekBar()
+                    }
                 }
                 Row(verticalAlignment = Alignment.CenterVertically) {
                     MuteButton()

From ba0f9a64537ef38f7483e88e1397aa293722ab2b Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 12:07:06 +0100
Subject: [PATCH 08/17] Add audio-only UI

---
 .../android/ui/demo/MainActivity.kt           |  29 ++-
 .../java/com/theoplayer/android/ui/AudioUI.kt | 181 ++++++++++++++++++
 .../theoplayer/android/ui/PlaybackRateList.kt |   4 +-
 3 files changed, 206 insertions(+), 8 deletions(-)
 create mode 100644 ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt

diff --git a/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt b/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt
index 5127a06..d551161 100644
--- a/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt
+++ b/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt
@@ -4,6 +4,7 @@ import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -18,6 +19,7 @@ import androidx.compose.material.icons.rounded.Refresh
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.tooling.preview.Preview
@@ -30,6 +32,7 @@ import com.theoplayer.android.api.ads.ima.GoogleImaIntegrationFactory
 import com.theoplayer.android.api.cast.CastConfiguration
 import com.theoplayer.android.api.cast.CastIntegrationFactory
 import com.theoplayer.android.api.cast.CastStrategy
+import com.theoplayer.android.ui.AudioUI
 import com.theoplayer.android.ui.DefaultUI
 import com.theoplayer.android.ui.demo.nitflex.NitflexUI
 import com.theoplayer.android.ui.demo.nitflex.theme.NitflexTheme
@@ -106,13 +109,12 @@ fun MainContent() {
                 }
             )
         }) { padding ->
-            val playerModifier = Modifier
-                .padding(padding)
-                .fillMaxSize(1f)
             when (theme) {
                 PlayerTheme.Default -> {
                     DefaultUI(
-                        modifier = playerModifier,
+                        modifier = Modifier
+                            .padding(padding)
+                            .fillMaxSize(1f),
                         player = player,
                         title = stream.title
                     )
@@ -121,7 +123,21 @@ fun MainContent() {
                 PlayerTheme.Nitflex -> {
                     NitflexTheme(useDarkTheme = true) {
                         NitflexUI(
-                            modifier = playerModifier,
+                            modifier = Modifier
+                                .padding(padding)
+                                .fillMaxSize(1f),
+                            player = player,
+                            title = stream.title
+                        )
+                    }
+                }
+
+                PlayerTheme.AudioOnly -> {
+                    Box(
+                        modifier = Modifier.padding(padding),
+                        contentAlignment = Alignment.Center
+                    ) {
+                        AudioUI(
                             player = player,
                             title = stream.title
                         )
@@ -156,7 +172,8 @@ fun MainContent() {
 
 enum class PlayerTheme(val title: String) {
     Default(title = "Default theme"),
-    Nitflex(title = "Nitflex theme")
+    Nitflex(title = "Nitflex theme"),
+    AudioOnly(title = "Audio-only")
 }
 
 @Composable
diff --git a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
new file mode 100644
index 0000000..99d46e7
--- /dev/null
+++ b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
@@ -0,0 +1,181 @@
+package com.theoplayer.android.ui
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.offset
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.material3.Text
+import androidx.compose.material3.minimumInteractiveComponentSize
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import com.theoplayer.android.api.THEOplayerConfig
+import com.theoplayer.android.api.THEOplayerView
+import com.theoplayer.android.api.source.SourceDescription
+import com.theoplayer.android.ui.theme.THEOplayerTheme
+
+/**
+ * An audio-only THEOplayer UI.
+ *
+ * This component provides a great audio player experience out-of-the-box, that works for all types
+ * of streams. It provides all the common playback controls for playing, seeking, changing
+ * languages and qualities.
+ *
+ * The colors and fonts can be changed by wrapping this inside a [THEOplayerTheme].
+ * For more extensive customizations, we recommend defining your own custom UI using
+ * a [UIController].
+ *
+ * @param modifier the [Modifier] to be applied to this UI
+ * @param config the player configuration to be used when constructing the [THEOplayerView]
+ * @param source the source description to load into the player
+ * @param title the stream's title, shown at the top of the player
+ * @see UIController
+ */
+@Composable
+fun AudioUI(
+    modifier: Modifier = Modifier,
+    config: THEOplayerConfig,
+    source: SourceDescription? = null,
+    title: String? = null
+) {
+    val player = rememberPlayer(config)
+    LaunchedEffect(player, source) {
+        player.source = source
+    }
+
+    AudioUI(modifier = modifier, player = player, title = title)
+}
+
+/**
+ * A default THEOplayer UI component.
+ *
+ * This component provides a great audio player experience out-of-the-box, that works for all types
+ * of streams. It provides all the common playback controls for playing, seeking, changing
+ * languages and qualities.
+ *
+ * The colors and fonts can be changed by wrapping this inside a [THEOplayerTheme].
+ * For more extensive customizations, we recommend defining your own custom UI using
+ * a [UIController].
+ *
+ * @param modifier the [Modifier] to be applied to this UI
+ * @param player the player. This should always be created using [rememberPlayer].
+ * @param title the stream's title, shown at the top of the player
+ * @see UIController
+ */
+@Composable
+fun AudioUI(
+    modifier: Modifier = Modifier,
+    iconSize: Dp = 32.dp,
+    player: Player = rememberPlayer(),
+    title: String? = null
+) {
+    UIController(
+        modifier = modifier,
+        player = player,
+        controlsVisible = true,
+        topChrome = {
+            Row(verticalAlignment = Alignment.CenterVertically) {
+                title?.let {
+                    Text(
+                        modifier = Modifier.padding(8.dp),
+                        text = it
+                    )
+                }
+                Spacer(modifier = Modifier.weight(1f))
+                LanguageMenuButton(iconModifier = Modifier.size(iconSize))
+                ChromecastButton(iconModifier = Modifier.size(iconSize))
+            }
+        },
+        centerChrome = {
+            ChromecastDisplay(modifier = Modifier.padding(8.dp))
+        },
+        bottomChrome = {
+            if (player.streamType != StreamType.Live) {
+                Box(
+                    modifier = Modifier.minimumInteractiveComponentSize(),
+                    contentAlignment = Alignment.CenterStart
+                ) {
+                    SeekBar()
+                }
+                Row(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .padding(horizontal = 12.dp)
+                        // Move slightly up, to reduce space below seek bar
+                        .offset(y = (-8).dp),
+                    verticalAlignment = Alignment.CenterVertically
+                ) {
+                    CurrentTimeDisplay()
+                    Spacer(modifier = Modifier.weight(1f))
+                    CurrentTimeDisplay(showRemaining = true)
+                }
+            }
+            Row(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .padding(horizontal = 12.dp),
+                horizontalArrangement = Arrangement.SpaceBetween,
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                MuteButton(
+                    iconModifier = Modifier.size(iconSize),
+                    contentPadding = PaddingValues(8.dp)
+                )
+                SeekButton(
+                    seekOffset = -10,
+                    iconSize = iconSize,
+                    contentPadding = PaddingValues(8.dp)
+                )
+                Box(contentAlignment = Alignment.Center) {
+                    if (player.firstPlay) {
+                        LoadingSpinner()
+                    }
+                    PlayButton(
+                        iconModifier = Modifier.size(iconSize),
+                        contentPadding = PaddingValues(8.dp)
+                    )
+                }
+                SeekButton(
+                    seekOffset = 10,
+                    iconSize = iconSize,
+                    contentPadding = PaddingValues(8.dp)
+                )
+                PlaybackRateButton(
+                    iconModifier = Modifier.size(iconSize),
+                    contentPadding = PaddingValues(8.dp)
+                )
+            }
+        },
+        errorOverlay = {
+            Box(contentAlignment = Alignment.Center) {
+                ErrorDisplay()
+            }
+        }
+    )
+}
+
+@Composable
+internal fun MenuScope.PlaybackRateButton(
+    modifier: Modifier = Modifier,
+    iconModifier: Modifier = Modifier,
+    contentPadding: PaddingValues = PaddingValues(0.dp)
+) {
+    val player = LocalPlayer.current
+    IconButton(
+        modifier = modifier,
+        contentPadding = contentPadding,
+        onClick = { openMenu { PlaybackRateMenu() } }) {
+        Text(
+            modifier = iconModifier,
+            text = formatPlaybackRate(player?.playbackRate ?: 1.0, "1x"),
+        )
+    }
+}
diff --git a/ui/src/main/java/com/theoplayer/android/ui/PlaybackRateList.kt b/ui/src/main/java/com/theoplayer/android/ui/PlaybackRateList.kt
index ba98a15..c8b238c 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/PlaybackRateList.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/PlaybackRateList.kt
@@ -49,9 +49,9 @@ fun PlaybackRateList(
 
 private val playbackRateFormat = DecimalFormat("#.##")
 
-internal fun formatPlaybackRate(rate: Double): String {
+internal fun formatPlaybackRate(rate: Double, default: String = "Normal"): String {
     return if (rate == 1.0) {
-        "Normal"
+        default
     } else {
         "${playbackRateFormat.format(rate)}x"
     }

From b190da186ccb47109ab852e3bf4d0f871abc871c Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 13:07:12 +0100
Subject: [PATCH 09/17] Use fastRountToInt()

---
 .../com/theoplayer/android/ui/Modifiers.kt     | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt b/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt
index 4c05ae6..5286e1a 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/Modifiers.kt
@@ -36,11 +36,11 @@ import androidx.compose.ui.platform.debugInspectorInfo
 import androidx.compose.ui.unit.Constraints
 import androidx.compose.ui.unit.IntSize
 import androidx.compose.ui.unit.isSatisfiedBy
+import androidx.compose.ui.util.fastRoundToInt
 import kotlinx.coroutines.coroutineScope
 import kotlinx.coroutines.currentCoroutineContext
 import kotlinx.coroutines.isActive
 import kotlinx.coroutines.launch
-import kotlin.math.roundToInt
 
 internal fun Modifier.pressable(
     interactionSource: MutableInteractionSource,
@@ -256,7 +256,7 @@ private class ConstrainedAspectRatioNode(
         measurable: IntrinsicMeasurable,
         height: Int
     ) = if (height != Constraints.Infinity) {
-        (height * aspectRatio).roundToInt()
+        (height * aspectRatio).fastRoundToInt()
     } else {
         measurable.minIntrinsicWidth(height)
     }
@@ -265,7 +265,7 @@ private class ConstrainedAspectRatioNode(
         measurable: IntrinsicMeasurable,
         height: Int
     ) = if (height != Constraints.Infinity) {
-        (height * aspectRatio).roundToInt()
+        (height * aspectRatio).fastRoundToInt()
     } else {
         measurable.maxIntrinsicWidth(height)
     }
@@ -274,7 +274,7 @@ private class ConstrainedAspectRatioNode(
         measurable: IntrinsicMeasurable,
         width: Int
     ) = if (width != Constraints.Infinity) {
-        (width / aspectRatio).roundToInt()
+        (width / aspectRatio).fastRoundToInt()
     } else {
         measurable.minIntrinsicHeight(width)
     }
@@ -283,7 +283,7 @@ private class ConstrainedAspectRatioNode(
         measurable: IntrinsicMeasurable,
         width: Int
     ) = if (width != Constraints.Infinity) {
-        (width / aspectRatio).roundToInt()
+        (width / aspectRatio).fastRoundToInt()
     } else {
         measurable.maxIntrinsicHeight(width)
     }
@@ -306,7 +306,7 @@ private class ConstrainedAspectRatioNode(
     private fun Constraints.tryMaxWidth(): IntSize {
         val maxWidth = this.maxWidth
         if (maxWidth != Constraints.Infinity) {
-            val height = (maxWidth / aspectRatio).roundToInt()
+            val height = (maxWidth / aspectRatio).fastRoundToInt()
             if (height > 0) {
                 val size = IntSize(maxWidth, height)
                 if (isSatisfiedBy(size)) {
@@ -320,7 +320,7 @@ private class ConstrainedAspectRatioNode(
     private fun Constraints.tryMaxHeight(): IntSize {
         val maxHeight = this.maxHeight
         if (maxHeight != Constraints.Infinity) {
-            val width = (maxHeight * aspectRatio).roundToInt()
+            val width = (maxHeight * aspectRatio).fastRoundToInt()
             if (width > 0) {
                 val size = IntSize(width, maxHeight)
                 if (isSatisfiedBy(size)) {
@@ -333,7 +333,7 @@ private class ConstrainedAspectRatioNode(
 
     private fun Constraints.tryMinWidth(): IntSize {
         val minWidth = this.minWidth
-        val height = (minWidth / aspectRatio).roundToInt()
+        val height = (minWidth / aspectRatio).fastRoundToInt()
         if (height > 0) {
             val size = IntSize(minWidth, height)
             if (isSatisfiedBy(size)) {
@@ -345,7 +345,7 @@ private class ConstrainedAspectRatioNode(
 
     private fun Constraints.tryMinHeight(): IntSize {
         val minHeight = this.minHeight
-        val width = (minHeight * aspectRatio).roundToInt()
+        val width = (minHeight * aspectRatio).fastRoundToInt()
         if (width > 0) {
             val size = IntSize(width, minHeight)
             if (isSatisfiedBy(size)) {

From 022cb70bd068bd7d2e87d04fae026ab9366d3fd4 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 13:37:59 +0100
Subject: [PATCH 10/17] Avoid fillMaxSize() where possible

---
 .../com/theoplayer/android/ui/UIController.kt     | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/UIController.kt b/ui/src/main/java/com/theoplayer/android/ui/UIController.kt
index 30651f1..cbc68bb 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/UIController.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/UIController.kt
@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.DisposableEffect
@@ -409,7 +407,6 @@ private fun UIControllerScope.PlayerControls(
 ) {
     centerOverlay?.let {
         Row(
-            modifier = Modifier.fillMaxSize(),
             horizontalArrangement = Arrangement.Center,
             verticalAlignment = Alignment.CenterVertically
         ) {
@@ -437,17 +434,19 @@ private fun UIControllerScope.PlayerControls(
     ) {
         centerChrome?.let {
             Row(
-                modifier = Modifier.fillMaxSize(),
                 horizontalArrangement = Arrangement.Center,
                 verticalAlignment = Alignment.CenterVertically
             ) {
                 it()
             }
         }
-        Column(modifier = Modifier.fillMaxSize()) {
-            topChrome?.let { it() }
-            Spacer(modifier = Modifier.weight(1f))
-            bottomChrome?.let { it() }
+        Column(verticalArrangement = Arrangement.SpaceBetween) {
+            Column {
+                topChrome?.let { it() }
+            }
+            Column {
+                bottomChrome?.let { it() }
+            }
         }
     }
 }

From d8349a8fb5e5ba8e34e0cdcba9f706d7d55e876b Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 14:43:47 +0100
Subject: [PATCH 11/17] Use RowScope for IconButton

---
 .../java/com/theoplayer/android/ui/IconButton.kt | 16 +++++++++++-----
 .../java/com/theoplayer/android/ui/SeekButton.kt |  3 ++-
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/IconButton.kt b/ui/src/main/java/com/theoplayer/android/ui/IconButton.kt
index eadd5e6..2af0a9c 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/IconButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/IconButton.kt
@@ -4,8 +4,10 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.Interaction
 import androidx.compose.foundation.interaction.MutableInteractionSource
-import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -14,6 +16,7 @@ import androidx.compose.material3.ButtonColors
 import androidx.compose.material3.IconButtonColors
 import androidx.compose.material3.IconButtonDefaults
 import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.TextButton
 import androidx.compose.material3.minimumInteractiveComponentSize
 import androidx.compose.material3.ripple
 import androidx.compose.runtime.Composable
@@ -53,9 +56,9 @@ fun IconButton(
     colors: IconButtonColors = IconButtonDefaults.iconButtonColors(),
     contentPadding: PaddingValues = PaddingValues(0.dp),
     interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
-    content: @Composable () -> Unit
+    content: @Composable RowScope.() -> Unit
 ) {
-    Box(
+    Row(
         modifier = modifier
             .minimumInteractiveComponentSize()
             .defaultMinSize(
@@ -72,10 +75,13 @@ fun IconButton(
                 interactionSource = interactionSource,
                 indication = ripple(bounded = false)
             ),
-        contentAlignment = Alignment.Center
+        horizontalArrangement = Arrangement.Center,
+        verticalAlignment = Alignment.CenterVertically,
     ) {
         val contentColor = colors.contentColor(enabled)
-        CompositionLocalProvider(LocalContentColor provides contentColor, content = content)
+        CompositionLocalProvider(LocalContentColor provides contentColor) {
+            content()
+        }
     }
 }
 
diff --git a/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt b/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt
index 1cef89d..c63df8d 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/SeekButton.kt
@@ -2,6 +2,7 @@ package com.theoplayer.android.ui
 
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.size
 import androidx.compose.material.icons.Icons
@@ -83,7 +84,7 @@ fun SeekButton(
     modifier: Modifier = Modifier,
     seekOffset: Int = 10,
     contentPadding: PaddingValues = PaddingValues(0.dp),
-    content: @Composable () -> Unit
+    content: @Composable RowScope.() -> Unit
 ) {
     val player = Player.current
     IconButton(

From d807cd071bbd3dfd25d68a78efbcf87a5d5027ae Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 15:05:02 +0100
Subject: [PATCH 12/17] Move ChromecastDisplay to bottom chrome

---
 ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
index 99d46e7..46c9c43 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
@@ -94,10 +94,8 @@ fun AudioUI(
                 ChromecastButton(iconModifier = Modifier.size(iconSize))
             }
         },
-        centerChrome = {
-            ChromecastDisplay(modifier = Modifier.padding(8.dp))
-        },
         bottomChrome = {
+            ChromecastDisplay(modifier = Modifier.padding(8.dp))
             if (player.streamType != StreamType.Live) {
                 Box(
                     modifier = Modifier.minimumInteractiveComponentSize(),

From 3a0ee2aeff95129ab55b18bb8d73a5453332255d Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 15:05:36 +0100
Subject: [PATCH 13/17] Fix text alignment

---
 .../java/com/theoplayer/android/ui/AudioUI.kt | 24 +++++++++++++------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
index 46c9c43..b154b7b 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
@@ -9,6 +9,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.sizeIn
 import androidx.compose.material3.Text
 import androidx.compose.material3.minimumInteractiveComponentSize
 import androidx.compose.runtime.Composable
@@ -84,10 +85,15 @@ fun AudioUI(
         topChrome = {
             Row(verticalAlignment = Alignment.CenterVertically) {
                 title?.let {
-                    Text(
-                        modifier = Modifier.padding(8.dp),
-                        text = it
-                    )
+                    Box(
+                        // Match size of menu buttons, to avoid layout shift
+                        modifier = Modifier
+                            .sizeIn(minHeight = iconSize)
+                            .minimumInteractiveComponentSize(),
+                        contentAlignment = Alignment.CenterStart
+                    ) {
+                        Text(text = it)
+                    }
                 }
                 Spacer(modifier = Modifier.weight(1f))
                 LanguageMenuButton(iconModifier = Modifier.size(iconSize))
@@ -171,9 +177,13 @@ internal fun MenuScope.PlaybackRateButton(
         modifier = modifier,
         contentPadding = contentPadding,
         onClick = { openMenu { PlaybackRateMenu() } }) {
-        Text(
+        Box(
             modifier = iconModifier,
-            text = formatPlaybackRate(player?.playbackRate ?: 1.0, "1x"),
-        )
+            contentAlignment = Alignment.Center
+        ) {
+            Text(
+                text = formatPlaybackRate(player?.playbackRate ?: 1.0, "1x"),
+            )
+        }
     }
 }

From 0700e203e8574ddfa2bd5e514c395907eedb89d5 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 15:06:43 +0100
Subject: [PATCH 14/17] Tweak

---
 ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
index b154b7b..c23e0ac 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
@@ -69,14 +69,15 @@ fun AudioUI(
  * @param modifier the [Modifier] to be applied to this UI
  * @param player the player. This should always be created using [rememberPlayer].
  * @param title the stream's title, shown at the top of the player
+ * @param iconSize the size of the icons
  * @see UIController
  */
 @Composable
 fun AudioUI(
     modifier: Modifier = Modifier,
-    iconSize: Dp = 32.dp,
     player: Player = rememberPlayer(),
-    title: String? = null
+    title: String? = null,
+    iconSize: Dp = 32.dp
 ) {
     UIController(
         modifier = modifier,

From efd99db64c2293248cdb315d9bafa5988fb22982 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 15:18:00 +0100
Subject: [PATCH 15/17] Tweak live UI

---
 .../main/java/com/theoplayer/android/ui/AudioUI.kt  | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
index c23e0ac..d5d0419 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
@@ -103,13 +103,14 @@ fun AudioUI(
         },
         bottomChrome = {
             ChromecastDisplay(modifier = Modifier.padding(8.dp))
+            Row(
+                modifier = Modifier.minimumInteractiveComponentSize(),
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                SeekBar(modifier = Modifier.weight(1f))
+                LiveButton(iconModifier = Modifier.size(iconSize))
+            }
             if (player.streamType != StreamType.Live) {
-                Box(
-                    modifier = Modifier.minimumInteractiveComponentSize(),
-                    contentAlignment = Alignment.CenterStart
-                ) {
-                    SeekBar()
-                }
                 Row(
                     modifier = Modifier
                         .fillMaxWidth()

From f676565ca8a98bfaf238865d12b7c330193fcecb Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 15:40:22 +0100
Subject: [PATCH 16/17] Move buttons around

---
 .../java/com/theoplayer/android/ui/AudioUI.kt | 83 ++++++++++---------
 1 file changed, 46 insertions(+), 37 deletions(-)

diff --git a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
index d5d0419..cc3c4fe 100644
--- a/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
+++ b/ui/src/main/java/com/theoplayer/android/ui/AudioUI.kt
@@ -9,7 +9,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.layout.sizeIn
 import androidx.compose.material3.Text
 import androidx.compose.material3.minimumInteractiveComponentSize
 import androidx.compose.runtime.Composable
@@ -86,19 +85,11 @@ fun AudioUI(
         topChrome = {
             Row(verticalAlignment = Alignment.CenterVertically) {
                 title?.let {
-                    Box(
-                        // Match size of menu buttons, to avoid layout shift
-                        modifier = Modifier
-                            .sizeIn(minHeight = iconSize)
-                            .minimumInteractiveComponentSize(),
-                        contentAlignment = Alignment.CenterStart
-                    ) {
-                        Text(text = it)
-                    }
+                    Text(
+                        modifier = Modifier.padding(8.dp),
+                        text = it
+                    )
                 }
-                Spacer(modifier = Modifier.weight(1f))
-                LanguageMenuButton(iconModifier = Modifier.size(iconSize))
-                ChromecastButton(iconModifier = Modifier.size(iconSize))
             }
         },
         bottomChrome = {
@@ -127,37 +118,55 @@ fun AudioUI(
             Row(
                 modifier = Modifier
                     .fillMaxWidth()
-                    .padding(horizontal = 12.dp),
-                horizontalArrangement = Arrangement.SpaceBetween,
+                    .padding(horizontal = 8.dp),
                 verticalAlignment = Alignment.CenterVertically
             ) {
-                MuteButton(
-                    iconModifier = Modifier.size(iconSize),
-                    contentPadding = PaddingValues(8.dp)
-                )
-                SeekButton(
-                    seekOffset = -10,
-                    iconSize = iconSize,
-                    contentPadding = PaddingValues(8.dp)
-                )
-                Box(contentAlignment = Alignment.Center) {
-                    if (player.firstPlay) {
-                        LoadingSpinner()
+                Row(
+                    modifier = Modifier.weight(1f),
+                    horizontalArrangement = Arrangement.Start,
+                    verticalAlignment = Alignment.CenterVertically
+                ) {
+                    MuteButton(
+                        iconModifier = Modifier.size(iconSize),
+                        contentPadding = PaddingValues(8.dp)
+                    )
+                }
+                Row(
+                    horizontalArrangement = Arrangement.Center,
+                    verticalAlignment = Alignment.CenterVertically
+                ) {
+                    SeekButton(
+                        seekOffset = -10,
+                        iconSize = iconSize,
+                        contentPadding = PaddingValues(8.dp)
+                    )
+                    Box(contentAlignment = Alignment.Center) {
+                        if (player.firstPlay) {
+                            LoadingSpinner()
+                        }
+                        PlayButton(
+                            iconModifier = Modifier.size(iconSize),
+                            contentPadding = PaddingValues(8.dp)
+                        )
                     }
-                    PlayButton(
+                    SeekButton(
+                        seekOffset = 10,
+                        iconSize = iconSize,
+                        contentPadding = PaddingValues(8.dp)
+                    )
+                }
+                Row(
+                    modifier = Modifier.weight(1f),
+                    horizontalArrangement = Arrangement.End,
+                    verticalAlignment = Alignment.CenterVertically
+                ) {
+                    PlaybackRateButton(
                         iconModifier = Modifier.size(iconSize),
                         contentPadding = PaddingValues(8.dp)
                     )
+                    LanguageMenuButton(iconModifier = Modifier.size(iconSize))
+                    ChromecastButton(iconModifier = Modifier.size(iconSize))
                 }
-                SeekButton(
-                    seekOffset = 10,
-                    iconSize = iconSize,
-                    contentPadding = PaddingValues(8.dp)
-                )
-                PlaybackRateButton(
-                    iconModifier = Modifier.size(iconSize),
-                    contentPadding = PaddingValues(8.dp)
-                )
             }
         },
         errorOverlay = {

From 45036611426ecf6bc176a9903d4801144ccf48f5 Mon Sep 17 00:00:00 2001
From: Mattias Buelens <mattias.buelens@theoplayer.com>
Date: Tue, 5 Nov 2024 15:41:53 +0100
Subject: [PATCH 17/17] Tweak demo

---
 .../main/java/com/theoplayer/android/ui/demo/MainActivity.kt  | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt b/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt
index d551161..447f4ac 100644
--- a/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt
+++ b/app/src/main/java/com/theoplayer/android/ui/demo/MainActivity.kt
@@ -134,7 +134,9 @@ fun MainContent() {
 
                 PlayerTheme.AudioOnly -> {
                     Box(
-                        modifier = Modifier.padding(padding),
+                        modifier = Modifier
+                            .fillMaxSize(1f)
+                            .padding(padding),
                         contentAlignment = Alignment.Center
                     ) {
                         AudioUI(