feat(SettingsScreen): improve UI

app/src/main/kotlin/com/aliucord/manager/ui/components/TextDivider.kt

@@ -5,12 +5,14 @@ import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 
 @Composable
 fun TextDivider(
     text: String,
+    style: TextStyle = MaterialTheme.typography.bodyMedium,
     modifier: Modifier = Modifier,
 ) {
     Row(
@@ -23,7 +25,7 @@ fun TextDivider(
 
         Text(
             text = text,
-            style = MaterialTheme.typography.bodySmall,
+            style = style,
             color = MaterialTheme.colorScheme.outline,
             fontWeight = FontWeight.SemiBold,
         )

app/src/main/kotlin/com/aliucord/manager/ui/components/settings/SettingsHeader.kt

@@ -1,19 +1,17 @@
 package com.aliucord.manager.ui.components.settings
 
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
+import com.aliucord.manager.ui.components.TextDivider
 
 @Composable
 fun SettingsHeader(
     text: String,
 ) {
-    Text(
+    TextDivider(
         text = text,
-        style = MaterialTheme.typography.titleSmall,
+        modifier = Modifier.padding(18.dp, 20.dp, 18.dp, 10.dp)
-        modifier = Modifier.padding(18.dp, 24.dp, 18.dp, 10.dp)
     )
 }

app/src/main/kotlin/com/aliucord/manager/ui/components/settings/SettingsItem.kt

@@ -22,7 +22,7 @@ fun SettingsItem(
         modifier = modifier
             .heightIn(min = 64.dp)
             .fillMaxWidth()
-            .padding(horizontal = 18.dp, vertical = 4.dp),
+            .padding(horizontal = 18.dp, vertical = 12.dp),
         horizontalArrangement = Arrangement.spacedBy(14.dp),
         verticalAlignment = Alignment.CenterVertically
     ) {

app/src/main/kotlin/com/aliucord/manager/ui/screens/settings/SettingsModel.kt

@@ -3,9 +3,11 @@ package com.aliucord.manager.ui.screens.settings
 import android.app.Application
 import androidx.compose.runtime.*
 import cafe.adriel.voyager.core.model.ScreenModel
+import cafe.adriel.voyager.core.model.screenModelScope
 import com.aliucord.manager.R
 import com.aliucord.manager.manager.PreferencesManager
 import com.aliucord.manager.ui.components.Theme
+import com.aliucord.manager.util.launchBlock
 import com.aliucord.manager.util.showToast
 
 class SettingsModel(
@@ -27,7 +29,7 @@ class SettingsModel(
         preferences.theme = theme
     }
 
-    fun clearCacheDir() {
+    fun clearCacheDir() = screenModelScope.launchBlock {
         application.externalCacheDir?.deleteRecursively()
         application.showToast(R.string.action_cleared_cache)
     }

app/src/main/kotlin/com/aliucord/manager/ui/screens/settings/SettingsScreen.kt

@@ -5,13 +5,13 @@
 
 package com.aliucord.manager.ui.screens.settings
 
+import android.os.Build
 import android.os.Parcelable
 import androidx.compose.foundation.*
 import androidx.compose.foundation.layout.*
 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.res.painterResource
 import androidx.compose.ui.res.stringResource
@@ -22,8 +22,8 @@ import cafe.adriel.voyager.koin.getScreenModel
 import com.aliucord.manager.R
 import com.aliucord.manager.di.DownloaderSetting
 import com.aliucord.manager.ui.components.BackButton
-import com.aliucord.manager.ui.components.Theme
 import com.aliucord.manager.ui.components.settings.*
+import com.aliucord.manager.ui.screens.settings.components.ThemeDialog
 import kotlinx.parcelize.IgnoredOnParcel
 import kotlinx.parcelize.Parcelize
 
@@ -71,18 +71,23 @@ class SettingsScreen : Screen, Parcelable {
                     }
                 }
 
-                SettingsSwitch(
+                // Material You theming on Android 12+
-                    label = stringResource(R.string.setting_dynamic_color),
+                if (Build.VERSION.SDK_INT >= 31) {
-                    pref = preferences.dynamicColor,
+                    SettingsSwitch(
-                    icon = { Icon(painterResource(R.drawable.ic_palette), null) }
+                        label = stringResource(R.string.setting_dynamic_color),
-                ) {
+                        secondaryLabel = stringResource(R.string.setting_dynamic_color_desc),
-                    preferences.dynamicColor = it
+                        pref = preferences.dynamicColor,
+                        icon = { Icon(painterResource(R.drawable.ic_palette), null) }
+                    ) {
+                        preferences.dynamicColor = it
+                    }
                 }
 
                 SettingsHeader(stringResource(R.string.settings_advanced))
 
                 SettingsSwitch(
                     label = stringResource(R.string.settings_developer_options),
+                    secondaryLabel = stringResource(R.string.settings_developer_options_desc),
                     pref = preferences.devMode,
                     icon = { Icon(painterResource(R.drawable.ic_code), null) }
                 ) {
@@ -97,8 +102,6 @@ class SettingsScreen : Screen, Parcelable {
                     onPrefChange = { preferences.keepPatchedApks = it },
                 )
 
-                Spacer(modifier = Modifier.height(14.dp))
-
                 SettingsSwitch(
                     label = stringResource(R.string.setting_alt_downloader),
                     secondaryLabel = stringResource(R.string.setting_alt_downloader_desc),
@@ -113,12 +116,17 @@ class SettingsScreen : Screen, Parcelable {
                     }
                 )
 
+                var clearedCache by rememberSaveable { mutableStateOf(false) }
                 Button(
+                    shape = ShapeDefaults.Large,
+                    enabled = !clearedCache,
+                    onClick = {
+                        clearedCache = true
+                        model.clearCacheDir()
+                    },
                     modifier = Modifier
                         .fillMaxWidth()
                         .padding(18.dp),
-                    shape = ShapeDefaults.Large,
-                    onClick = model::clearCacheDir
                 ) {
                     Text(
                         text = stringResource(R.string.setting_clear_cache),
@@ -129,57 +137,3 @@ class SettingsScreen : Screen, Parcelable {
         }
     }
 }
-
-@Composable
-fun ThemeDialog(
-    currentTheme: Theme,
-    onDismissRequest: () -> Unit,
-    onConfirm: (Theme) -> Unit,
-) {
-    var selectedTheme by rememberSaveable { mutableStateOf(currentTheme) }
-
-    AlertDialog(
-        onDismissRequest = onDismissRequest,
-        icon = {
-            Icon(
-                painter = painterResource(R.drawable.ic_brush),
-                contentDescription = stringResource(R.string.settings_theme)
-            )
-        },
-        title = { Text(stringResource(R.string.settings_theme)) },
-        text = {
-            Column {
-                Theme.entries.forEach { theme ->
-                    Row(
-                        modifier = Modifier
-                            .clickable { selectedTheme = theme }
-                            .padding(start = 8.dp),
-                        verticalAlignment = Alignment.CenterVertically
-                    ) {
-                        Text(
-                            text = theme.toDisplayName(),
-                            style = MaterialTheme.typography.labelLarge
-                        )
-
-                        Spacer(Modifier.weight(1f, true))
-
-                        RadioButton(
-                            selected = theme == selectedTheme,
-                            onClick = { selectedTheme = theme }
-                        )
-                    }
-                }
-            }
-        },
-        confirmButton = {
-            Button(
-                onClick = {
-                    onConfirm(selectedTheme)
-                    onDismissRequest()
-                }
-            ) {
-                Text(stringResource(R.string.action_apply))
-            }
-        }
-    )
-}

app/src/main/kotlin/com/aliucord/manager/ui/screens/settings/components/ThemeDialog.kt

@@ -0,0 +1,79 @@
+package com.aliucord.manager.ui.screens.settings.components
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.*
+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.draw.clip
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import com.aliucord.manager.R
+import com.aliucord.manager.ui.components.Theme
+
+@Composable
+fun ThemeDialog(
+    currentTheme: Theme,
+    onDismissRequest: () -> Unit,
+    onConfirm: (Theme) -> Unit,
+) {
+    var selectedTheme by rememberSaveable { mutableStateOf(currentTheme) }
+
+    AlertDialog(
+        onDismissRequest = onDismissRequest,
+        icon = {
+            Icon(
+                painter = painterResource(R.drawable.ic_brush),
+                contentDescription = stringResource(R.string.settings_theme),
+                modifier = Modifier.size(32.dp),
+            )
+        },
+        title = { Text(stringResource(R.string.settings_theme)) },
+        text = {
+            Column {
+                for (theme in Theme.entries) key(theme) {
+                    val interactionSource = remember(::MutableInteractionSource)
+
+                    Row(
+                        verticalAlignment = Alignment.Companion.CenterVertically,
+                        modifier = Modifier.Companion
+                            .clickable(
+                                indication = null,
+                                interactionSource = interactionSource,
+                                onClick = { selectedTheme = theme },
+                            )
+                            .clip(MaterialTheme.shapes.medium)
+                            .padding(horizontal = 6.dp, vertical = 8.dp),
+                    ) {
+                        Text(
+                            text = theme.toDisplayName(),
+                            style = MaterialTheme.typography.labelLarge,
+                        )
+
+                        Spacer(Modifier.Companion.weight(1f, true))
+
+                        RadioButton(
+                            selected = theme == selectedTheme,
+                            onClick = { selectedTheme = theme },
+                            interactionSource = interactionSource,
+                        )
+                    }
+                }
+            }
+        },
+        confirmButton = {
+            Button(
+                onClick = {
+                    onConfirm(selectedTheme)
+                    onDismissRequest()
+                },
+            ) {
+                Text(stringResource(R.string.action_apply))
+            }
+        },
+    )
+}

app/src/main/res/values/strings.xml

@@ -41,12 +41,14 @@
   <string name="settings_advanced">Advanced</string>
   <string name="settings_appearance">Appearance</string>
   <string name="settings_developer_options">Developer options</string>
+  <string name="settings_developer_options_desc">Don\'t enable this unless you know what you are doing!</string>
   <string name="setting_clear_cache">Clear cache</string>
   <string name="setting_dynamic_color">Dynamic color</string>
+  <string name="setting_dynamic_color_desc">Enables Material You theming on Android 12+</string>
   <string name="setting_keep_patched_apks">Keep patched APKs</string>
-  <string name="setting_keep_patched_apks_desc">Don\'t delete patched APKs after installing (for installing manually)</string>
+  <string name="setting_keep_patched_apks_desc">Keep all patched files and APKs after installing for debugging.</string>
   <string name="setting_alt_downloader">Alternative downloader</string>
-  <string name="setting_alt_downloader_desc">Use a custom HTTP client instead of the system DownloadManager. May fix errors on some devices</string>
+  <string name="setting_alt_downloader_desc">Use a custom HTTP client instead of the system DownloadManager. May fix download errors on specific devices.</string>
 
   <string name="theme_system">System</string>
   <string name="theme_dark">Dark</string>