faster update and better layout

apps/multiplatform/common/src/androidMain/kotlin/chat/simplex/common/views/usersettings/Appearance.android.kt

@@ -119,11 +119,11 @@ fun AppearanceScope.AppearanceLayout(
 
     SectionDividerSpaced()
     BarsAlphaSection(MR.strings.appearance_in_app_bars_alpha, appPrefs.inAppBarsAlpha, 0.9f)
-    SectionDividerSpaced()
-    SectionSpacer()
+
+    SectionDividerSpaced(maxTopPadding = true)
     BarsAlphaSection(MR.strings.appearance_nav_bar_alpha, appPrefs.navBarAlpha, 0.6f)
 
-    SectionDividerSpaced()
+    SectionDividerSpaced(maxTopPadding = true)
     ProfileImageSection()
 
     SectionDividerSpaced(maxTopPadding = true)

apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/usersettings/Appearance.kt

@@ -173,34 +173,30 @@ object AppearanceScope {
 
   @Composable
   fun BarsAlphaSection(sectionTitle: StringResource, pref: SharedPreference<Float>, defaultValue: Float) {
-    val barsAlpha = remember { mutableStateOf(pref.get()) }
+    val prefValue = remember { pref.state }.value
     SectionView(stringResource(sectionTitle).uppercase(), contentPadding = PaddingValues(horizontal = DEFAULT_PADDING)) {
       Row(Modifier.padding(top = 10.dp), verticalAlignment = Alignment.CenterVertically) {
         Box(Modifier.size(60.dp)
           .background(MaterialTheme.colors.surface, RoundedCornerShape(percent = 22))
           .clip(RoundedCornerShape(percent = 22))
           .clickable {
-            barsAlpha.value = defaultValue
-            pref.set(barsAlpha.value)
+            pref.set(defaultValue)
           },
           contentAlignment = Alignment.Center) {
-          Text("${barsAlpha.value}",
-            color = if (barsAlpha.value == defaultValue) MaterialTheme.colors.primary else MaterialTheme.colors.onBackground,
+          Text("$prefValue",
+            color = if (prefValue == defaultValue) MaterialTheme.colors.primary else MaterialTheme.colors.onBackground,
             fontSize = 12.sp,
             maxLines = 1
           )
         }
         Spacer(Modifier.width(10.dp))
         Slider(
-          barsAlpha.value,
+          prefValue,
           valueRange = 0f..1f,
           steps = 11,
           onValueChange = {
             val diff = it % 0.1f
-            barsAlpha.value = String.format(Locale.US, "%.1f", it + (if (diff >= 0.05f) -diff + 0.1f else -diff)).toFloatOrNull() ?: 1f
-          },
-          onValueChangeFinished = {
-            pref.set(barsAlpha.value)
+            pref.set(String.format(Locale.US, "%.1f", it + (if (diff >= 0.05f) -diff + 0.1f else -diff)).toFloatOrNull() ?: 1f)
           },
           colors = SliderDefaults.colors(
             activeTickColor = Color.Transparent,