[TV] Adjust settings dialogs

kamgurgul · Dec 17, 2024 · 3aca226 · 3aca226
1 parent 2422f33
commit 3aca226
Show file tree

Hide file tree

Showing 3 changed files with 83 additions and 49 deletions.
diff --git a/androidApp/src/androidMain/kotlin/com/kgurgul/cpuinfo/features/settings/TvSettingsScreen.kt b/androidApp/src/androidMain/kotlin/com/kgurgul/cpuinfo/features/settings/TvSettingsScreen.kt
@@ -1,6 +1,5 @@
 package com.kgurgul.cpuinfo.features.settings
 
-import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
@@ -13,7 +12,6 @@ import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material3.AlertDialog
-import androidx.compose.material3.Button
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.RadioButton
 import androidx.compose.material3.RadioButtonDefaults
@@ -25,13 +23,15 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.kgurgul.cpuinfo.shared.Res
 import com.kgurgul.cpuinfo.shared.cancel
 import com.kgurgul.cpuinfo.shared.general
 import com.kgurgul.cpuinfo.shared.pref_theme
 import com.kgurgul.cpuinfo.shared.pref_theme_choose
 import com.kgurgul.cpuinfo.shared.temperature_unit
+import com.kgurgul.cpuinfo.ui.components.tv.TvButton
 import com.kgurgul.cpuinfo.ui.components.tv.TvListItem
 import com.kgurgul.cpuinfo.ui.theme.spacingLarge
 import com.kgurgul.cpuinfo.ui.theme.spacingMedium
@@ -163,41 +163,46 @@ private fun TemperatureUnitDialog(
             title = {
                 Text(text = stringResource(Res.string.temperature_unit))
             },
+            tonalElevation = 0.dp,
+            containerColor = MaterialTheme.colorScheme.surface,
             text = {
                 val scrollState = rememberScrollState()
                 Column(
                     verticalArrangement = Arrangement.spacedBy(spacingSmall),
                     modifier = Modifier.verticalScroll(scrollState),
                 ) {
                     for (option in options) {
-                        Row(
-                            horizontalArrangement = Arrangement.spacedBy(spacingMedium),
-                            modifier = Modifier
-                                .fillMaxWidth()
-                                .clickable {
-                                    onOptionClicked(option)
-                                    onDismissRequest()
-                                }
-                                .padding(vertical = spacingSmall),
+                        TvListItem(
+                            onClick = {
+                                onOptionClicked(option)
+                                onDismissRequest()
+                            },
                         ) {
-                            RadioButton(
-                                selected = option == currentSelection,
-                                onClick = null,
-                                colors = RadioButtonDefaults.colors(
-                                    selectedColor = MaterialTheme.colorScheme.tertiary,
-                                ),
-                            )
-                            Text(
-                                text = getTemperatureUnit(option = option),
-                                style = MaterialTheme.typography.titleMedium,
-                                color = MaterialTheme.colorScheme.onBackground,
-                            )
+                            Row(
+                                horizontalArrangement = Arrangement.spacedBy(spacingMedium),
+                                modifier = Modifier
+                                    .fillMaxWidth()
+                                    .padding(vertical = spacingSmall),
+                            ) {
+                                RadioButton(
+                                    selected = option == currentSelection,
+                                    onClick = null,
+                                    colors = RadioButtonDefaults.colors(
+                                        selectedColor = MaterialTheme.colorScheme.tertiary,
+                                    ),
+                                )
+                                Text(
+                                    text = getTemperatureUnit(option = option),
+                                    style = MaterialTheme.typography.titleMedium,
+                                    color = MaterialTheme.colorScheme.onBackground,
+                                )
+                            }
                         }
                     }
                 }
             },
             confirmButton = {
-                Button(
+                TvButton(
                     onClick = onDismissRequest,
                 ) {
                     Text(text = stringResource(Res.string.cancel))
@@ -221,41 +226,46 @@ private fun ThemeDialog(
             title = {
                 Text(text = stringResource(Res.string.pref_theme_choose))
             },
+            tonalElevation = 0.dp,
+            containerColor = MaterialTheme.colorScheme.surface,
             text = {
                 val scrollState = rememberScrollState()
                 Column(
                     verticalArrangement = Arrangement.spacedBy(spacingSmall),
                     modifier = Modifier.verticalScroll(scrollState),
                 ) {
                     for (option in options) {
-                        Row(
-                            horizontalArrangement = Arrangement.spacedBy(spacingMedium),
-                            modifier = Modifier
-                                .fillMaxWidth()
-                                .clickable {
-                                    onOptionClicked(option)
-                                    onDismissRequest()
-                                }
-                                .padding(vertical = spacingSmall),
+                        TvListItem(
+                            onClick = {
+                                onOptionClicked(option)
+                                onDismissRequest()
+                            },
                         ) {
-                            RadioButton(
-                                selected = option == currentSelection,
-                                onClick = null,
-                                colors = RadioButtonDefaults.colors(
-                                    selectedColor = MaterialTheme.colorScheme.tertiary,
-                                ),
-                            )
-                            Text(
-                                text = getThemeName(option = option),
-                                style = MaterialTheme.typography.titleMedium,
-                                color = MaterialTheme.colorScheme.onBackground,
-                            )
+                            Row(
+                                horizontalArrangement = Arrangement.spacedBy(spacingMedium),
+                                modifier = Modifier
+                                    .fillMaxWidth()
+                                    .padding(vertical = spacingSmall),
+                            ) {
+                                RadioButton(
+                                    selected = option == currentSelection,
+                                    onClick = null,
+                                    colors = RadioButtonDefaults.colors(
+                                        selectedColor = MaterialTheme.colorScheme.tertiary,
+                                    ),
+                                )
+                                Text(
+                                    text = getThemeName(option = option),
+                                    style = MaterialTheme.typography.titleMedium,
+                                    color = MaterialTheme.colorScheme.onBackground,
+                                )
+                            }
                         }
                     }
                 }
             },
             confirmButton = {
-                Button(
+                TvButton(
                     onClick = onDismissRequest,
                 ) {
                     Text(text = stringResource(Res.string.cancel))

diff --git a/androidApp/src/androidMain/kotlin/com/kgurgul/cpuinfo/ui/components/tv/TvButtons.kt b/androidApp/src/androidMain/kotlin/com/kgurgul/cpuinfo/ui/components/tv/TvButtons.kt
@@ -1,9 +1,12 @@
 package com.kgurgul.cpuinfo.ui.components.tv
 
 import androidx.compose.foundation.layout.BoxScope
+import androidx.compose.foundation.layout.RowScope
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.tv.material3.Button
+import androidx.tv.material3.ButtonDefaults
 import androidx.tv.material3.IconButton
 import androidx.tv.material3.IconButtonDefaults
 import androidx.tv.material3.OutlinedIconButton
@@ -45,3 +48,22 @@ fun TvOutlinedIconButton(
         content = content,
     )
 }
+
+@Composable
+fun TvButton(
+    onClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    content: @Composable RowScope.() -> Unit
+) {
+    Button(
+        onClick = onClick,
+        modifier = modifier,
+        colors = ButtonDefaults.colors(
+            containerColor = MaterialTheme.colorScheme.surfaceTint.copy(alpha = 0.7f),
+            contentColor = MaterialTheme.colorScheme.onSurface,
+            focusedContainerColor = MaterialTheme.colorScheme.surfaceTint,
+            focusedContentColor = MaterialTheme.colorScheme.onSurface,
+        ),
+        content = content,
+    )
+}
diff --git a/androidApp/src/androidMain/kotlin/com/kgurgul/cpuinfo/ui/components/tv/TvListItem.kt b/androidApp/src/androidMain/kotlin/com/kgurgul/cpuinfo/ui/components/tv/TvListItem.kt
@@ -3,22 +3,24 @@ package com.kgurgul.cpuinfo.ui.components.tv
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.tv.material3.DenseListItem
+import androidx.tv.material3.ListItemColors
 import androidx.tv.material3.ListItemDefaults
 import androidx.tv.material3.MaterialTheme
 
 @Composable
 fun TvListItem(
     modifier: Modifier = Modifier,
     onClick: () -> Unit = {},
+    colors: ListItemColors = ListItemDefaults.colors(
+        focusedContainerColor = MaterialTheme.colorScheme.inverseSurface.copy(alpha = 0.3f),
+    ),
     headlineContent: @Composable () -> Unit,
 ) {
     DenseListItem(
         selected = false,
         onClick = onClick,
         scale = ListItemDefaults.scale(focusedScale = 1.01f),
-        colors = ListItemDefaults.colors(
-            focusedContainerColor = MaterialTheme.colorScheme.inverseSurface.copy(alpha = 0.3f),
-        ),
+        colors = colors,
         headlineContent = headlineContent,
         modifier = modifier,
     )