FIX: Drawer colors

This commit is contained in:
webfussel 2025-08-01 20:38:27 +02:00
parent 26a5640987
commit 5dbdb9f7d2
4 changed files with 35 additions and 51 deletions

View file

@ -5,30 +5,31 @@ import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge import androidx.activity.enableEdgeToEdge
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.runtime.compositionLocalOf
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import androidx.compose.ui.tooling.preview.Preview
import de.webfussel.soulecho.mood.MoodSection import de.webfussel.soulecho.mood.MoodSection
import de.webfussel.soulecho.mood.MoodWithInfo import de.webfussel.soulecho.mood.MoodWithInfo
import de.webfussel.soulecho.mood.PossibleMood import de.webfussel.soulecho.mood.PossibleMood
import de.webfussel.soulecho.navigation.Drawer import de.webfussel.soulecho.navigation.Drawer
import de.webfussel.soulecho.ui.theme.SoulEchoTheme import de.webfussel.soulecho.ui.theme.SoulEchoTheme
val LocalMoodState = compositionLocalOf<MoodWithInfo> { error("No MoodState provided") }
@Composable @Composable
fun SoulEchoApp() { fun SoulEchoApp() {
var currentMood by remember { var currentMood by remember { mutableStateOf(MoodWithInfo(mood = PossibleMood.HAPPY, info = "")) }
mutableStateOf(MoodWithInfo(mood = PossibleMood.HAPPY, info = ""))
} CompositionLocalProvider(LocalMoodState provides currentMood) {
SoulEchoTheme (currentTheme = currentMood.mood) { SoulEchoTheme () {
Drawer ( Drawer () {
currentMood = currentMood.mood, MoodSection(
) { onMoodChange = { currentMood = it }
MoodSection( )
currentMood = currentMood, }
onMoodChange = { currentMood = it }
)
} }
} }
} }
@ -41,10 +42,4 @@ class MainActivity : ComponentActivity() {
SoulEchoApp() SoulEchoApp()
} }
} }
}
@Preview(showBackground = true)
@Composable
fun DefaultPreview() {
SoulEchoApp()
} }

View file

@ -22,16 +22,18 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import de.webfussel.soulecho.LocalMoodState
import de.webfussel.soulecho.mood.Moods.getMoodById import de.webfussel.soulecho.mood.Moods.getMoodById
import de.webfussel.soulecho.R import de.webfussel.soulecho.R
@Composable @Composable
fun MoodSection( fun MoodSection(
currentMood: MoodWithInfo = MoodWithInfo(mood = PossibleMood.HAPPY, info = ""),
onMoodChange: (MoodWithInfo) -> Unit = {} onMoodChange: (MoodWithInfo) -> Unit = {}
) { ) {
val currentMood = LocalMoodState.current
var dialogOpen by remember { mutableStateOf(false) } var dialogOpen by remember { mutableStateOf(false) }
val theme = MaterialTheme.colorScheme val theme = MaterialTheme.colorScheme
Box(modifier = Modifier.fillMaxSize()) { Box(modifier = Modifier.fillMaxSize()) {
Column( Column(
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,

View file

@ -2,11 +2,13 @@ package de.webfussel.soulecho.navigation
import de.webfussel.soulecho.R import de.webfussel.soulecho.R
import androidx.compose.foundation.Image import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
@ -42,6 +44,7 @@ import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import de.webfussel.soulecho.LocalMoodState
import de.webfussel.soulecho.mood.Moods.getMoodById import de.webfussel.soulecho.mood.Moods.getMoodById
import de.webfussel.soulecho.mood.PossibleMood import de.webfussel.soulecho.mood.PossibleMood
import kotlinx.coroutines.launch import kotlinx.coroutines.launch
@ -53,14 +56,14 @@ fun CustomNavigationDrawerItem(
selected: Boolean, selected: Boolean,
onClick: () -> Unit, onClick: () -> Unit,
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
contentPadding: PaddingValues = PaddingValues(horizontal = 12.dp, vertical = 8.dp) contentPadding: PaddingValues = PaddingValues(horizontal = 16.dp, vertical = 8.dp)
) { ) {
Surface( Surface(
selected = selected, selected = selected,
onClick = onClick, onClick = onClick,
modifier = modifier.fillMaxWidth(), modifier = modifier.fillMaxWidth(),
color = if (selected) MaterialTheme.colorScheme.primary else Color.Transparent, color = if (selected) MaterialTheme.colorScheme.background else Color.Transparent,
shape = RoundedCornerShape(12.dp) shape = RoundedCornerShape(8.dp)
) { ) {
Row( Row(
modifier = Modifier.padding(contentPadding), modifier = Modifier.padding(contentPadding),
@ -78,16 +81,15 @@ fun NavigationBlock (
items : List<NavigationEntry>, items : List<NavigationEntry>,
currentNavigation: NavigationEntry, currentNavigation: NavigationEntry,
onNavigationItemClicked: (NavigationEntry) -> Unit = {}, onNavigationItemClicked: (NavigationEntry) -> Unit = {},
currentMood: PossibleMood = PossibleMood.HAPPY,
) { ) {
val theme = MaterialTheme.colorScheme val currentMood = LocalMoodState.current.mood
for (item in items) { for (item in items) {
CustomNavigationDrawerItem( CustomNavigationDrawerItem(
icon = { icon = {
Icon( Icon(
painterResource( painterResource(
if (item.id == "current") getMoodById(currentMood).icon else item.icon if (item.id == "current") getMoodById(currentMood).icon else item.icon
), ),
contentDescription = item.label, contentDescription = item.label,
modifier = Modifier.size(20.dp), modifier = Modifier.size(20.dp),
@ -120,11 +122,11 @@ fun DrawerTop() {
.align(Alignment.BottomStart) .align(Alignment.BottomStart)
.padding(bottom = 16.dp, start = 16.dp), .padding(bottom = 16.dp, start = 16.dp),
style = TextStyle( style = TextStyle(
fontSize = 24.sp, fontSize = 32.sp,
shadow = Shadow( shadow = Shadow(
color = Color.Black, color = Color.Black,
offset = Offset(2f, 5f), offset = Offset(0f, 0f),
blurRadius = 2f, blurRadius = 8f,
) )
), ),
color = Color.White, color = Color.White,
@ -133,14 +135,13 @@ fun DrawerTop() {
} }
@Composable @Composable
fun DrawerContent ( fun DrawerContent () {
currentMood: PossibleMood = PossibleMood.HAPPY,
) {
var currentNavigation by remember { var currentNavigation by remember {
mutableStateOf(Navigation.getTopNavigation()[0]) mutableStateOf(Navigation.getTopNavigation()[0])
} }
ModalDrawerSheet( ModalDrawerSheet(
drawerContainerColor = MaterialTheme.colorScheme.surface,
modifier = Modifier.width(224.dp) modifier = Modifier.width(224.dp)
) { ) {
Column { Column {
@ -151,7 +152,6 @@ fun DrawerContent (
items = Navigation.getTopNavigation(), items = Navigation.getTopNavigation(),
currentNavigation = currentNavigation, currentNavigation = currentNavigation,
onNavigationItemClicked = { currentNavigation = it }, onNavigationItemClicked = { currentNavigation = it },
currentMood = currentMood,
) )
Spacer(Modifier.weight(1f)) Spacer(Modifier.weight(1f))
NavigationBlock( NavigationBlock(
@ -166,7 +166,6 @@ fun DrawerContent (
@OptIn(ExperimentalMaterial3Api::class) @OptIn(ExperimentalMaterial3Api::class)
@Composable @Composable
fun Drawer ( fun Drawer (
currentMood: PossibleMood = PossibleMood.HAPPY,
content: @Composable (PaddingValues) -> Unit content: @Composable (PaddingValues) -> Unit
) { ) {
val state = rememberDrawerState(initialValue = DrawerValue.Closed) val state = rememberDrawerState(initialValue = DrawerValue.Closed)
@ -175,8 +174,8 @@ fun Drawer (
var currentPage by remember { mutableStateOf("Stimmung") } var currentPage by remember { mutableStateOf("Stimmung") }
ModalNavigationDrawer( ModalNavigationDrawer(
drawerContent = { DrawerContent(currentMood = currentMood) }, drawerContent = { DrawerContent() },
drawerState = state drawerState = state,
) { ) {
Scaffold ( Scaffold (
topBar = { topBar = {
@ -202,18 +201,4 @@ fun Drawer (
innerPadding -> content(innerPadding) innerPadding -> content(innerPadding)
} }
} }
}
@Preview
@Composable
fun DrawerPreview() {
Drawer {
Text("Test", modifier = Modifier.padding(it))
}
}
@Preview
@Composable
fun DrawerContentPreview() {
DrawerContent()
} }

View file

@ -9,10 +9,12 @@ import androidx.compose.material3.lightColorScheme
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.platform.LocalContext
import de.webfussel.soulecho.LocalMoodState
import de.webfussel.soulecho.mood.PossibleMood import de.webfussel.soulecho.mood.PossibleMood
// Base-Konfiguration für alle Themes // Base-Konfiguration für alle Themes
private val BaseColorConfig = object { private val BaseColorConfig = object {
val surface = Color.White
val onPrimary = Color.White val onPrimary = Color.White
} }
@ -20,7 +22,7 @@ private val BaseColorConfig = object {
private fun createEmotionColorScheme(fgColor: Color, bgColor: Color) = lightColorScheme( private fun createEmotionColorScheme(fgColor: Color, bgColor: Color) = lightColorScheme(
primary = fgColor, primary = fgColor,
background = bgColor, background = bgColor,
surface = bgColor, surface = BaseColorConfig.surface,
onPrimary = BaseColorConfig.onPrimary, onPrimary = BaseColorConfig.onPrimary,
onBackground = fgColor, onBackground = fgColor,
onSurface = fgColor, onSurface = fgColor,
@ -40,9 +42,9 @@ private val PanicColorTheme = createEmotionColorScheme(PanicFg, PanicBg)
@Composable @Composable
fun SoulEchoTheme( fun SoulEchoTheme(
currentTheme: PossibleMood = PossibleMood.HAPPY,
content: @Composable () -> Unit content: @Composable () -> Unit
) { ) {
val currentTheme = LocalMoodState.current.mood
val colorScheme = when (currentTheme) { val colorScheme = when (currentTheme) {
PossibleMood.HAPPY -> HappyColorTheme PossibleMood.HAPPY -> HappyColorTheme
PossibleMood.RELAXED -> RelaxedColorTheme PossibleMood.RELAXED -> RelaxedColorTheme