From b75d1228a1e376db30686141fb7fd77cb782be15 Mon Sep 17 00:00:00 2001 From: Sad Ellie Date: Thu, 21 Jul 2022 21:27:34 +0300 Subject: [PATCH] Updated drop down settings option. Now it kinda follows the guideline. --- .../setttings/components/SettingsListItem.kt | 36 +++++++++++++++---- .../unitto/screens/theming/ThemesScreen.kt | 10 ++++-- app/src/main/res/values-en-rGB/strings.xml | 4 ++- app/src/main/res/values-ru/strings.xml | 4 ++- app/src/main/res/values/strings.xml | 4 ++- 5 files changed, 45 insertions(+), 13 deletions(-) diff --git a/app/src/main/java/com/sadellie/unitto/screens/setttings/components/SettingsListItem.kt b/app/src/main/java/com/sadellie/unitto/screens/setttings/components/SettingsListItem.kt index 5fb4d5c1..05f0e2fd 100644 --- a/app/src/main/java/com/sadellie/unitto/screens/setttings/components/SettingsListItem.kt +++ b/app/src/main/java/com/sadellie/unitto/screens/setttings/components/SettingsListItem.kt @@ -18,6 +18,9 @@ package com.sadellie.unitto.screens.setttings.components +import androidx.compose.animation.core.FastOutSlowInEasing +import androidx.compose.animation.core.animateFloatAsState +import androidx.compose.animation.core.tween import androidx.compose.foundation.clickable import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.layout.Column @@ -26,9 +29,12 @@ import androidx.compose.foundation.layout.RowScope import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.widthIn +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.outlined.ArrowDropDown import androidx.compose.material.ripple.rememberRipple import androidx.compose.material3.DropdownMenuItem import androidx.compose.material3.ExposedDropdownMenuBox +import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme import androidx.compose.material3.OutlinedTextField import androidx.compose.material3.Switch @@ -42,8 +48,11 @@ import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.rotate +import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp +import com.sadellie.unitto.R /** * Basic list item for settings screen. By default only has label and support text, clickable. @@ -137,7 +146,8 @@ fun SettingsListItem( * * @param label Main text. * @param supportText Text that is located below label. - * @param allOptions Options in drop-down menu. + * @param allOptions Options in drop-down menu. Key is option itself and value is the string that + * will be shown. * @param selected Selected option. * @param onSelectedChange Action to perform when drop-down menu item is selected. */ @@ -145,12 +155,16 @@ fun SettingsListItem( fun SettingsListItem( label: String, supportText: String? = null, - allOptions: Collection, + allOptions: Map, selected: T, onSelectedChange: (T) -> Unit ) = BasicSettingsListItem(label, supportText, {}) { var dropDownExpanded by rememberSaveable { mutableStateOf(false) } var currentOption by rememberSaveable { mutableStateOf(selected) } + val dropDownRotation: Float by animateFloatAsState( + targetValue = if (dropDownExpanded) 180f else 0f, + animationSpec = tween(easing = FastOutSlowInEasing) + ) ExposedDropdownMenuBox( modifier = Modifier, @@ -159,7 +173,7 @@ fun SettingsListItem( ) { OutlinedTextField( modifier = Modifier.widthIn(1.dp), - value = currentOption.toString(), + value = allOptions[currentOption] ?: selected.toString(), onValueChange = {}, readOnly = true, singleLine = true, @@ -167,7 +181,15 @@ fun SettingsListItem( colors = TextFieldDefaults.outlinedTextFieldColors( disabledBorderColor = MaterialTheme.colorScheme.outline, disabledTextColor = MaterialTheme.colorScheme.onSurface, - ) + disabledTrailingIconColor = MaterialTheme.colorScheme.onSurfaceVariant + ), + trailingIcon = { + Icon( + imageVector = Icons.Outlined.ArrowDropDown, + modifier = Modifier.rotate(dropDownRotation), + contentDescription = stringResource(R.string.drop_down_description) + ) + } ) ExposedDropdownMenu( modifier = Modifier.exposedDropdownSize(), @@ -176,10 +198,10 @@ fun SettingsListItem( ) { allOptions.forEach { DropdownMenuItem( - text = { Text(it.toString()) }, + text = { Text(it.value) }, onClick = { - currentOption = it - onSelectedChange(it) + currentOption = it.key + onSelectedChange(it.key) dropDownExpanded = false } ) diff --git a/app/src/main/java/com/sadellie/unitto/screens/theming/ThemesScreen.kt b/app/src/main/java/com/sadellie/unitto/screens/theming/ThemesScreen.kt index c519f6cb..606c92c5 100644 --- a/app/src/main/java/com/sadellie/unitto/screens/theming/ThemesScreen.kt +++ b/app/src/main/java/com/sadellie/unitto/screens/theming/ThemesScreen.kt @@ -39,14 +39,18 @@ fun ThemesScreen( viewModel: ThemesViewModel ) { UnittoLargeTopAppBar( - title = stringResource(id = R.string.theme_setting), + title = stringResource(R.string.theme_setting), navigateUpAction = navigateUpAction ) { paddingValues -> LazyColumn(contentPadding = paddingValues) { item { SettingsListItem( - label = stringResource(R.string.theme_setting), - allOptions = ThemingMode.values().toList(), + label = stringResource(R.string.color_theme), + allOptions = mapOf( + ThemingMode.AUTO to stringResource(R.string.force_auto_mode), + ThemingMode.FORCE_LIGHT to stringResource(R.string.force_light_mode), + ThemingMode.FORCE_DARK to stringResource(R.string.force_dark_mode) + ), selected = themmoController.currentThemingMode, onSelectedChange = { themmoController.setThemingMode(it) diff --git a/app/src/main/res/values-en-rGB/strings.xml b/app/src/main/res/values-en-rGB/strings.xml index 001fa879..d0057820 100644 --- a/app/src/main/res/values-en-rGB/strings.xml +++ b/app/src/main/res/values-en-rGB/strings.xml @@ -737,7 +737,9 @@ Add or remove unit from favorites Empty search result Dynamic colors - Generate theme from your current wallpaper + Use colours from your wallpaper Use black background for dark themes + Colour theme + Open or close drop down menu \ No newline at end of file diff --git a/app/src/main/res/values-ru/strings.xml b/app/src/main/res/values-ru/strings.xml index 44984314..334dcafc 100644 --- a/app/src/main/res/values-ru/strings.xml +++ b/app/src/main/res/values-ru/strings.xml @@ -672,7 +672,9 @@ Все данные анонимны и зашифрованы Название версии Динамичные цвета - Использовать цвета обоев рабочего стола + Использовать цвета обоев Использовать черный фон в темных темах + Цветовая тема + Открыть или закрыть меню \ No newline at end of file diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 41c6add4..7f82b16f 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -990,10 +990,11 @@ Auto Light Dark + Color theme AMOLED Dark Use black background for dark themes Dynamic colors - Generate theme from your current wallpaper + Use colors from your wallpaper Loading… @@ -1014,6 +1015,7 @@ Clear input Add or remove unit from favorites Empty search result + Open or close drop down menu Send usage statistics All data is anonymous and encrypted Version name