diff --git a/you-have-mail-android/app/src/main/java/dev/lbeernaert/youhavemail/screens/Settings.kt b/you-have-mail-android/app/src/main/java/dev/lbeernaert/youhavemail/screens/Settings.kt index 0335350..1f00858 100644 --- a/you-have-mail-android/app/src/main/java/dev/lbeernaert/youhavemail/screens/Settings.kt +++ b/you-have-mail-android/app/src/main/java/dev/lbeernaert/youhavemail/screens/Settings.kt @@ -1,24 +1,21 @@ package dev.lbeernaert.youhavemail.screens -import androidx.compose.foundation.background import androidx.compose.foundation.clickable -import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.wrapContentSize -import androidx.compose.foundation.layout.wrapContentWidth +import androidx.compose.foundation.layout.width import androidx.compose.material.Divider import androidx.compose.material.DropdownMenu import androidx.compose.material.DropdownMenuItem import androidx.compose.material.ExperimentalMaterialApi +import androidx.compose.material.ExposedDropdownMenuBox import androidx.compose.material.ExposedDropdownMenuDefaults import androidx.compose.material.MaterialTheme import androidx.compose.material.Text import androidx.compose.material.TextField -import androidx.compose.material.TextFieldDefaults import androidx.compose.runtime.Composable import androidx.compose.runtime.collectAsState import androidx.compose.runtime.getValue @@ -26,14 +23,14 @@ import androidx.compose.runtime.mutableIntStateOf import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue -import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier -import androidx.compose.ui.graphics.Color -import androidx.compose.ui.res.colorResource +import androidx.compose.ui.geometry.Size +import androidx.compose.ui.layout.onGloballyPositioned +import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.res.stringResource -import androidx.compose.ui.text.TextStyle import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.toSize import dev.lbeernaert.youhavemail.R import dev.lbeernaert.youhavemail.app.State import dev.lbeernaert.youhavemail.components.ActionButton @@ -65,6 +62,8 @@ fun Settings( listOf(30UL, 60UL, 120UL, 180UL, 300UL, 600UL, 900UL, 1200UL, 1800UL, 3600UL) var expanded by remember { mutableStateOf(false) } var selectedIndex by remember { mutableIntStateOf(0) } + // textFieldWidth is used to assign to DropDownMenu the same width as TextField + var textFieldWidth by remember { mutableStateOf(Size.Zero)} val onPollIntervalModified: () -> Unit = { runTask(updatingPollIntervalLabel) { @@ -83,24 +82,59 @@ fun Settings( text = stringResource(id = R.string.poll_interval_desc), style = MaterialTheme.typography.subtitle1 ) + Spacer(modifier = Modifier.padding(5.dp)) - TextField( + + ExposedDropdownMenuBox( modifier = Modifier - .fillMaxWidth() - .clickable { expanded = !expanded }, - value = secondsToText(pollIntervalValue), - textStyle = TextStyle(color = Color.Black), - readOnly = true, - enabled = false, - singleLine = true, - onValueChange = {}, - trailingIcon = { - ExposedDropdownMenuDefaults.TrailingIcon( - expanded = expanded, - onIconClick = { expanded = !expanded }) - }, - colors = TextFieldDefaults.textFieldColors(backgroundColor = colorResource(id = R.color.gray_dropdownmenu)), - ) + .fillMaxWidth(), + expanded = expanded, + onExpandedChange = { + expanded = !expanded + } + ) { + TextField( + modifier = Modifier + .fillMaxWidth() + .clickable { expanded = !expanded } + .onGloballyPositioned { coordinates -> + textFieldWidth = coordinates.size.toSize() + }, + readOnly = true, + enabled = true, + value = secondsToText(pollIntervalValue), + onValueChange = { }, + trailingIcon = { + ExposedDropdownMenuDefaults.TrailingIcon( + expanded = expanded, + onIconClick = { expanded = true } + ) + }, + colors = ExposedDropdownMenuDefaults.textFieldColors() + ) + DropdownMenu( + modifier = Modifier + .width(with(LocalDensity.current) { textFieldWidth.width.toDp() }), + expanded = expanded, + onDismissRequest = { + expanded = false + }, + ) { + timeIntervals.forEachIndexed { index, seconds -> + DropdownMenuItem( + modifier = Modifier + .fillMaxWidth(), + onClick = { + expanded = false + selectedIndex = index + onPollIntervalModified() + }, + ) { + Text(text = secondsToText(seconds)) + } + } + } + } Spacer(modifier = Modifier.padding(5.dp)) @@ -114,34 +148,6 @@ fun Settings( ) Spacer(modifier = Modifier.padding(5.dp)) - - Box( - modifier = Modifier - .padding(20.dp) - .fillMaxSize() - .wrapContentSize(Alignment.TopStart) - ) { - DropdownMenu( - expanded = expanded, - onDismissRequest = { expanded = false }, - modifier = Modifier - .background(colorResource(id = R.color.gray_dropdownmenu)) - .wrapContentWidth() - ) { - timeIntervals.forEachIndexed { index, seconds -> - DropdownMenuItem(onClick = { - expanded = false - selectedIndex = index - onPollIntervalModified() - }) { - Text( - text = secondsToText(seconds), - color = Color.Black - ) - } - } - } - } } } } diff --git a/you-have-mail-android/app/src/main/res/values/colors.xml b/you-have-mail-android/app/src/main/res/values/colors.xml index 441817c..f8c6127 100644 --- a/you-have-mail-android/app/src/main/res/values/colors.xml +++ b/you-have-mail-android/app/src/main/res/values/colors.xml @@ -7,5 +7,4 @@ #FF018786 #FF000000 #FFFFFFFF - #FFDDDDDD \ No newline at end of file