From 7673d580d1754a0faa666f8d28e8bd0697068a57 Mon Sep 17 00:00:00 2001 From: dimitrisKlokidis Date: Sun, 6 Oct 2024 18:51:25 +0300 Subject: [PATCH 1/4] color picker grid --- .../com/mensinator/app/ManageSymptomDialog.kt | 97 +++++++++++-------- .../com/mensinator/app/data/DataSource.kt | 1 - 2 files changed, 59 insertions(+), 39 deletions(-) diff --git a/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt b/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt index 2165787..5e5e896 100644 --- a/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt +++ b/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt @@ -10,10 +10,8 @@ import androidx.compose.foundation.layout.Row 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.layout.size -import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.shape.RoundedCornerShape @@ -42,7 +40,6 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.Color -import androidx.compose.ui.platform.LocalConfiguration import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource @@ -64,7 +61,13 @@ fun ManageSymptom( val dbHelper = remember { PeriodDatabaseHelper(context) } var initialSymptoms = remember { dbHelper.getAllSymptoms() } var savedSymptoms by remember { mutableStateOf(initialSymptoms) } - + val colorMap = DataSource(isDarkMode()).colorMap + val colorsPerColumn = colorMap.size / 3 + val colorColumns = listOf( + colorMap.entries.take(colorsPerColumn), + colorMap.entries.drop(colorsPerColumn).take(colorsPerColumn), + colorMap.entries.drop(colorsPerColumn * 2) + ) // State to manage the rename dialog visibility var showRenameDialog by remember { mutableStateOf(false) } var symptomToRename by remember { mutableStateOf(null) } @@ -73,8 +76,6 @@ fun ManageSymptom( var showDeleteDialog by remember { mutableStateOf(false) } var symptomToDelete by remember { mutableStateOf(null) } - val screenHeight = LocalConfiguration.current.screenHeightDp.dp - val menuHeight = screenHeight * 0.8f // 80% of the screen height Column( modifier = Modifier @@ -193,39 +194,54 @@ fun ManageSymptom( expanded = expanded, onDismissRequest = { expanded = false }, modifier = Modifier - .width(50.dp) - .height(menuHeight) - .clip(RoundedCornerShape(100.dp)) + .wrapContentSize() ) { - DataSource(isDarkMode()).colorMap.forEach { (colorName, colorValue) -> - //val keyColor = ResourceMapper.getStringResourceId(colorName) - DropdownMenuItem( - onClick = { - selectedColorName = colorName - expanded = false - val updatedSymptom = symptom.copy(color = colorName) - savedSymptoms = savedSymptoms.map { - if (it.id == symptom.id) updatedSymptom else it - } - // Save settings to the database - savedSymptoms.forEach { symptom -> - dbHelper.updateSymptom( - symptom.id, - symptom.active, - symptom.color + Row( + modifier = Modifier.wrapContentSize(), + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.Center + ) { + colorColumns.forEach { columnColors -> + Column( + modifier = Modifier + .weight(1f) + .wrapContentSize() + ) { + columnColors.forEach { (colorName, colorValue) -> + DropdownMenuItem( + modifier = Modifier + .size(50.dp) + .clip(RoundedCornerShape(100.dp)), + onClick = { + selectedColorName = colorName + expanded = false + val updatedSymptom = + symptom.copy(color = colorName) + savedSymptoms = savedSymptoms.map { + if (it.id == symptom.id) updatedSymptom else it + } + // Save settings to the database + savedSymptoms.forEach { symptom -> + dbHelper.updateSymptom( + symptom.id, + symptom.active, + symptom.color + ) + } + onSave() + }, + text = { + Box( + modifier = Modifier + .size(25.dp) + .clip(RoundedCornerShape(26.dp)) + .background(colorValue) // Use the color from the map + ) + } ) } - onSave() - }, - text = { - Box( - modifier = Modifier - .size(25.dp) - .clip(RoundedCornerShape(26.dp)) - .background(colorValue), // Use the color from the map - ) } - ) + } } } } @@ -235,13 +251,18 @@ fun ManageSymptom( Switch( checked = symptom.active == 1, onCheckedChange = { checked -> - val updatedSymptom = symptom.copy(active = if (checked) 1 else 0) + val updatedSymptom = + symptom.copy(active = if (checked) 1 else 0) savedSymptoms = savedSymptoms.map { if (it.id == symptom.id) updatedSymptom else it } // Save settings to the database savedSymptoms.forEach { symptom -> - dbHelper.updateSymptom(symptom.id, symptom.active, symptom.color) + dbHelper.updateSymptom( + symptom.id, + symptom.active, + symptom.color + ) } onSave() }, @@ -288,7 +309,7 @@ fun ManageSymptom( ) } -// Show the delete confirmation dialog + // Show the delete confirmation dialog if (showDeleteDialog) { AlertDialog( onDismissRequest = { diff --git a/app/src/main/java/com/mensinator/app/data/DataSource.kt b/app/src/main/java/com/mensinator/app/data/DataSource.kt index 185fa47..1344d10 100644 --- a/app/src/main/java/com/mensinator/app/data/DataSource.kt +++ b/app/src/main/java/com/mensinator/app/data/DataSource.kt @@ -48,7 +48,6 @@ class DataSource(isDarkTheme: Boolean) { "Green" to Color(0xFF668E53), "Blue" to Color(0xFF5E71A1), "Yellow" to Color(0xFFB3974D), - "Cyan" to Color(0xFF5E8CA1), "Magenta" to Color(0xFF75568A), "Orange" to Color(0xFFB37E4D), From 44c073eca930573487fe33c7406fa82ca6073bab Mon Sep 17 00:00:00 2001 From: dimitrisKlokidis Date: Tue, 8 Oct 2024 11:20:23 +0300 Subject: [PATCH 2/4] color changes --- app/src/main/java/com/mensinator/app/data/DataSource.kt | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/app/src/main/java/com/mensinator/app/data/DataSource.kt b/app/src/main/java/com/mensinator/app/data/DataSource.kt index 1344d10..cc51717 100644 --- a/app/src/main/java/com/mensinator/app/data/DataSource.kt +++ b/app/src/main/java/com/mensinator/app/data/DataSource.kt @@ -22,7 +22,6 @@ class DataSource(isDarkTheme: Boolean) { "Orange" to Color(0xFFF2CBA6), "Black" to Color(0xFF212121), - "White" to Color(0xFFF5F5F5), "DarkGray" to Color(0xFFABABAB), "LightGray" to Color(0xFFDFDDDD), @@ -48,6 +47,7 @@ class DataSource(isDarkTheme: Boolean) { "Green" to Color(0xFF668E53), "Blue" to Color(0xFF5E71A1), "Yellow" to Color(0xFFB3974D), + "Cyan" to Color(0xFF5E8CA1), "Magenta" to Color(0xFF75568A), "Orange" to Color(0xFFB37E4D), @@ -59,7 +59,6 @@ class DataSource(isDarkTheme: Boolean) { "DarkMagenta" to Color(0xFF513663), "DarkOrange" to Color(0xFF6B4B2E), - "Black" to Color(0xFF212121), "White" to Color(0xFFF5F5F5), "DarkGray" to Color(0xFF585858), "LightGray" to Color(0xFF8F8F8F) From dc1b8b1c66e29c01de304ac3227d965f5712e672 Mon Sep 17 00:00:00 2001 From: dimitrisKlokidis Date: Tue, 8 Oct 2024 11:42:56 +0300 Subject: [PATCH 3/4] fixed the position of the DropdownMenu --- .../com/mensinator/app/ManageSymptomDialog.kt | 98 ++++++++++--------- 1 file changed, 52 insertions(+), 46 deletions(-) diff --git a/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt b/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt index 5e5e896..b5101c7 100644 --- a/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt +++ b/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt @@ -26,6 +26,7 @@ import androidx.compose.material3.DropdownMenu import androidx.compose.material3.DropdownMenuItem import androidx.compose.material3.Icon import androidx.compose.material3.IconButton +import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Switch import androidx.compose.material3.SwitchDefaults import androidx.compose.material3.Text @@ -45,6 +46,7 @@ import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.mensinator.app.data.DataSource @@ -189,56 +191,60 @@ fun ManageSymptom( ) } } - - DropdownMenu( - expanded = expanded, - onDismissRequest = { expanded = false }, - modifier = Modifier - .wrapContentSize() + MaterialTheme( + shapes = MaterialTheme.shapes.copy(extraSmall = RoundedCornerShape(16.dp)) ) { - Row( - modifier = Modifier.wrapContentSize(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.Center + DropdownMenu( + offset = DpOffset(x = (-50).dp, y = (10).dp), + expanded = expanded, + onDismissRequest = { expanded = false }, + modifier = Modifier + .wrapContentSize() ) { - colorColumns.forEach { columnColors -> - Column( - modifier = Modifier - .weight(1f) - .wrapContentSize() - ) { - columnColors.forEach { (colorName, colorValue) -> - DropdownMenuItem( - modifier = Modifier - .size(50.dp) - .clip(RoundedCornerShape(100.dp)), - onClick = { - selectedColorName = colorName - expanded = false - val updatedSymptom = - symptom.copy(color = colorName) - savedSymptoms = savedSymptoms.map { - if (it.id == symptom.id) updatedSymptom else it - } - // Save settings to the database - savedSymptoms.forEach { symptom -> - dbHelper.updateSymptom( - symptom.id, - symptom.active, - symptom.color + Row( + modifier = Modifier.wrapContentSize(), + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.Center + ) { + colorColumns.forEach { columnColors -> + Column( + modifier = Modifier + .weight(1f) + .wrapContentSize() + ) { + columnColors.forEach { (colorName, colorValue) -> + DropdownMenuItem( + modifier = Modifier + .size(50.dp) + .clip(RoundedCornerShape(100.dp)), + onClick = { + selectedColorName = colorName + expanded = false + val updatedSymptom = + symptom.copy(color = colorName) + savedSymptoms = savedSymptoms.map { + if (it.id == symptom.id) updatedSymptom else it + } + // Save settings to the database + savedSymptoms.forEach { symptom -> + dbHelper.updateSymptom( + symptom.id, + symptom.active, + symptom.color + ) + } + onSave() + }, + text = { + Box( + modifier = Modifier + .size(25.dp) + .clip(RoundedCornerShape(26.dp)) + .background(colorValue) // Use the color from the map ) } - onSave() - }, - text = { - Box( - modifier = Modifier - .size(25.dp) - .clip(RoundedCornerShape(26.dp)) - .background(colorValue) // Use the color from the map - ) - } - ) + ) + } } } } From ac1c266fc6f78e0f2b655d40ba5822bac43be20e Mon Sep 17 00:00:00 2001 From: dimitrisKlokidis Date: Tue, 8 Oct 2024 11:50:31 +0300 Subject: [PATCH 4/4] change the colorColumns to use colorMap.entries.chunked --- .../main/java/com/mensinator/app/ManageSymptomDialog.kt | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt b/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt index b5101c7..7e7b80d 100644 --- a/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt +++ b/app/src/main/java/com/mensinator/app/ManageSymptomDialog.kt @@ -65,11 +65,8 @@ fun ManageSymptom( var savedSymptoms by remember { mutableStateOf(initialSymptoms) } val colorMap = DataSource(isDarkMode()).colorMap val colorsPerColumn = colorMap.size / 3 - val colorColumns = listOf( - colorMap.entries.take(colorsPerColumn), - colorMap.entries.drop(colorsPerColumn).take(colorsPerColumn), - colorMap.entries.drop(colorsPerColumn * 2) - ) + val colorColumns = colorMap.entries.chunked(colorsPerColumn) + // State to manage the rename dialog visibility var showRenameDialog by remember { mutableStateOf(false) } var symptomToRename by remember { mutableStateOf(null) }