feat: redesign settings screen

2026-07-22 17:41:39 +00:00 · 2026-05-23 12:55:37 +00:00
parent d81c382ba5
commit ef56db5d16
8 changed files with 109 additions and 31 deletions
--- a/app/build.gradle.kts
+++ b/app/build.gradle.kts
@@ -24,12 +24,10 @@ android {
    buildTypes {
        debug {
            applicationIdSuffix = ".debug"
-            versionCode = providers.gradleProperty("purefinDebugVersionCode").get().toInt()
            versionNameSuffix = "-debug"
            manifestPlaceholders["updateManifestUrl"] = "https://apks.t.bbara.hu/apps/purefin-app-debug/update.json"
        }
        release {
-            versionCode = providers.gradleProperty("purefinReleaseVersionCode").get().toInt()
            // Enables code-related app optimization.
            isMinifyEnabled = true

@@ -51,6 +49,19 @@ android {
    }
 }

+androidComponents {
+    onVariants(selector().withBuildType("debug")) { variant ->
+        variant.outputs.forEach { output ->
+            output.versionCode.set(providers.gradleProperty("purefinDebugVersionCode").map { it.toInt() })
+        }
+    }
+    onVariants(selector().withBuildType("release")) { variant ->
+        variant.outputs.forEach { output ->
+            output.versionCode.set(providers.gradleProperty("purefinReleaseVersionCode").map { it.toInt() })
+        }
+    }
+}
+
 kotlin {
    compilerOptions {
        jvmTarget.set(JvmTarget.JVM_11)
--- a/app/src/main/java/hu/bbara/purefin/ui/screen/settings/SettingsScreen.kt
+++ b/app/src/main/java/hu/bbara/purefin/ui/screen/settings/SettingsScreen.kt
@@ -1,12 +1,18 @@
 package hu.bbara.purefin.ui.screen.settings

-import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.outlined.ArrowBack
-import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.Card
+import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.SnackbarHost
@@ -61,30 +67,52 @@ fun SettingsScreen(
        }
    ) { innerPadding ->
        LazyColumn(
-            verticalArrangement = Arrangement.spacedBy(8.dp),
+            contentPadding = PaddingValues(horizontal = 16.dp, vertical = 16.dp),
            modifier = Modifier
                .fillMaxSize()
                .padding(innerPadding)
        ) {
-            settingGroups.forEach { group ->
+            settingGroups.forEachIndexed { groupIndex, group ->
                group.title?.let { title ->
-                    item {
+                    item(key = "${groupIndex}-title") {
                        Text(
                            text = title,
-                            style = MaterialTheme.typography.titleMedium,
+                            style = MaterialTheme.typography.titleSmall,
                            color = MaterialTheme.colorScheme.primary,
-                            modifier = Modifier.padding(horizontal = 24.dp, vertical = 8.dp)
+                            modifier = Modifier.padding(
+                                start = 16.dp,
+                                top = 8.dp,
+                                end = 16.dp,
+                                bottom = 4.dp
+                            )
                        )
                    }
                }

-                group.options.forEach { option ->
-                    item(key = option.key) {
+                itemsIndexed(
+                    items = group.options,
+                    key = { _, option -> option.key }
+                ) { index, option ->
+                    Card(
+                        colors = CardDefaults.cardColors(
+                            containerColor = MaterialTheme.colorScheme.surface
+                        ),
+                        shape = groupedSettingItemShape(
+                            index = index,
+                            itemCount = group.options.size
+                        ),
+                        modifier = Modifier.fillMaxWidth()
+                    ) {
                        SettingOptionItem(
                            option = option,
                            viewModel = viewModel
                        )
-                        HorizontalDivider()
+                    }
+                }
+
+                if (groupIndex < settingGroups.lastIndex) {
+                    item(key = "${groupIndex}-spacer") {
+                        Spacer(modifier = Modifier.height(16.dp))
                    }
                }
            }
@@ -92,6 +120,31 @@ fun SettingsScreen(
    }
 }

+private fun groupedSettingItemShape(
+    index: Int,
+    itemCount: Int
+): RoundedCornerShape {
+    val cornerRadius = 12.dp
+    return when {
+        itemCount == 1 -> RoundedCornerShape(cornerRadius)
+        index == 0 -> RoundedCornerShape(
+            topStart = cornerRadius,
+            topEnd = cornerRadius,
+            bottomStart = 0.dp,
+            bottomEnd = 0.dp
+        )
+
+        index == itemCount - 1 -> RoundedCornerShape(
+            topStart = 0.dp,
+            topEnd = 0.dp,
+            bottomStart = cornerRadius,
+            bottomEnd = cornerRadius
+        )
+
+        else -> RoundedCornerShape(0.dp)
+    }
+}
+
@Composable
 private fun SettingOptionItem(
    option: SettingOption<*>,
--- a/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/BooleanSettingItem.kt
+++ b/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/BooleanSettingItem.kt
@@ -1,19 +1,22 @@
 package hu.bbara.purefin.ui.screen.settings.components

-import androidx.compose.foundation.clickable
+import androidx.compose.foundation.selection.toggleable
 import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Switch
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.semantics.Role

@Composable
 fun BooleanSettingItem(
    title: String,
    value: Boolean,
    onValueChange: (Boolean) -> Unit,
-    modifier: Modifier = Modifier.Companion
+    modifier: Modifier = Modifier
 ) {
    ListItem(
        headlineContent = {
@@ -25,9 +28,14 @@ fun BooleanSettingItem(
        trailingContent = {
            Switch(
                checked = value,
-                onCheckedChange = onValueChange
+                onCheckedChange = null
            )
        },
-        modifier = modifier.clickable { onValueChange(!value) }
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+        modifier = modifier.toggleable(
+            value = value,
+            role = Role.Switch,
+            onValueChange = onValueChange
+        )
    )
-}
+}
--- a/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/DropdownSettingItem.kt
+++ b/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/DropdownSettingItem.kt
@@ -23,7 +23,7 @@ fun <T> DropdownSettingItem(
    value: T,
    options: List<T>,
    onValueChange: (T) -> Unit,
-    modifier: Modifier = Modifier.Companion
+    modifier: Modifier = Modifier
 ) {
    var expanded by remember { mutableStateOf(false) }

@@ -32,7 +32,7 @@ fun <T> DropdownSettingItem(
        onExpandedChange = { expanded = it },
        modifier = modifier
            .fillMaxWidth()
-            .padding(horizontal = 24.dp, vertical = 16.dp)
+            .padding(horizontal = 16.dp, vertical = 12.dp)
    ) {
        OutlinedTextField(
            value = value.toString(),
--- a/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/RangeSettingItem.kt
+++ b/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/RangeSettingItem.kt
@@ -22,7 +22,7 @@ fun RangeSettingItem(
    value: Double,
    valueRange: ClosedFloatingPointRange<Double>,
    onValueChange: (Double) -> Unit,
-    modifier: Modifier = Modifier.Companion
+    modifier: Modifier = Modifier
 ) {
    var sliderValue by remember(value) { mutableStateOf(value.toFloat()) }

@@ -30,14 +30,14 @@ fun RangeSettingItem(
        verticalArrangement = Arrangement.spacedBy(8.dp),
        modifier = modifier
            .fillMaxWidth()
-            .padding(horizontal = 24.dp, vertical = 16.dp)
+            .padding(horizontal = 16.dp, vertical = 12.dp)
    ) {
        Text(
            text = title,
            style = MaterialTheme.typography.bodyLarge
        )
        Text(
-            text = String.Companion.format(Locale.US, "%.1f", sliderValue),
+            text = String.format(Locale.US, "%.1f", sliderValue),
            style = MaterialTheme.typography.bodyMedium,
            color = MaterialTheme.colorScheme.onSurfaceVariant
        )
@@ -46,7 +46,7 @@ fun RangeSettingItem(
            onValueChange = { sliderValue = it },
            onValueChangeFinished = { onValueChange(sliderValue.toDouble()) },
            valueRange = valueRange.start.toFloat()..valueRange.endInclusive.toFloat(),
-            modifier = Modifier.Companion.fillMaxWidth()
+            modifier = Modifier.fillMaxWidth()
        )
    }
-}
+}
--- a/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/ReadOnlySettingItem.kt
+++ b/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/ReadOnlySettingItem.kt
@@ -1,16 +1,18 @@
 package hu.bbara.purefin.ui.screen.settings.components

 import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color

@Composable
 fun ReadOnlySettingItem(
    title: String,
    value: String,
-    modifier: Modifier = Modifier.Companion
+    modifier: Modifier = Modifier
 ) {
    ListItem(
        headlineContent = {
@@ -19,13 +21,14 @@ fun ReadOnlySettingItem(
                style = MaterialTheme.typography.bodyLarge
            )
        },
-        trailingContent = {
+        supportingContent = {
            Text(
                text = value,
                style = MaterialTheme.typography.bodyMedium,
                color = MaterialTheme.colorScheme.onSurfaceVariant
            )
        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
        modifier = modifier
    )
 }
--- a/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/StringSettingItem.kt
+++ b/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/StringSettingItem.kt
@@ -15,7 +15,7 @@ fun StringSettingItem(
    title: String,
    value: String,
    onValueChange: (String) -> Unit,
-    modifier: Modifier = Modifier.Companion
+    modifier: Modifier = Modifier
 ) {
    OutlinedTextField(
        value = value,
@@ -23,10 +23,10 @@ fun StringSettingItem(
        label = { Text(title) },
        singleLine = true,
        keyboardOptions = KeyboardOptions(
-            capitalization = KeyboardCapitalization.Companion.Words
+            capitalization = KeyboardCapitalization.Words
        ),
        modifier = modifier
            .fillMaxWidth()
-            .padding(horizontal = 24.dp, vertical = 16.dp)
+            .padding(horizontal = 16.dp, vertical = 12.dp)
    )
-}
+}
--- a/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/VoidSettingItem.kt
+++ b/app/src/main/java/hu/bbara/purefin/ui/screen/settings/components/VoidSettingItem.kt
@@ -2,16 +2,18 @@ package hu.bbara.purefin.ui.screen.settings.components

 import androidx.compose.foundation.clickable
 import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color

@Composable
 fun VoidSettingItem(
    title: String,
    onClick: () -> Unit,
-    modifier: Modifier = Modifier.Companion
+    modifier: Modifier = Modifier
 ) {
    ListItem(
        headlineContent = {
@@ -20,6 +22,7 @@ fun VoidSettingItem(
                style = MaterialTheme.typography.bodyLarge
            )
        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
        modifier = modifier.clickable(onClick = onClick)
    )
 }