applying dynamic colour scheme and fixing appbar/navbar quirks
This commit is contained in:
parent
692e179e3f
commit
ef7af20853
|
@ -3,8 +3,10 @@ package app.dapk.st.design.components
|
||||||
import androidx.compose.foundation.isSystemInDarkTheme
|
import androidx.compose.foundation.isSystemInDarkTheme
|
||||||
import androidx.compose.material3.MaterialTheme
|
import androidx.compose.material3.MaterialTheme
|
||||||
import androidx.compose.material3.darkColorScheme
|
import androidx.compose.material3.darkColorScheme
|
||||||
|
import androidx.compose.material3.dynamicDarkColorScheme
|
||||||
import androidx.compose.runtime.*
|
import androidx.compose.runtime.*
|
||||||
import androidx.compose.ui.graphics.Color
|
import androidx.compose.ui.graphics.Color
|
||||||
|
import androidx.compose.ui.platform.LocalContext
|
||||||
import com.google.accompanist.systemuicontroller.rememberSystemUiController
|
import com.google.accompanist.systemuicontroller.rememberSystemUiController
|
||||||
import kotlin.math.absoluteValue
|
import kotlin.math.absoluteValue
|
||||||
|
|
||||||
|
@ -56,6 +58,7 @@ fun SmallTalkTheme(content: @Composable () -> Unit) {
|
||||||
val systemUiController = rememberSystemUiController()
|
val systemUiController = rememberSystemUiController()
|
||||||
val systemInDarkTheme = isSystemInDarkTheme()
|
val systemInDarkTheme = isSystemInDarkTheme()
|
||||||
MaterialTheme(
|
MaterialTheme(
|
||||||
|
colorScheme = dynamicDarkColorScheme(LocalContext.current)
|
||||||
// colorScheme = if (systemInDarkTheme) DARK_COLOURS else LIGHT_COLOURS,
|
// colorScheme = if (systemInDarkTheme) DARK_COLOURS else LIGHT_COLOURS,
|
||||||
) {
|
) {
|
||||||
val backgroundColor = MaterialTheme.colorScheme.background
|
val backgroundColor = MaterialTheme.colorScheme.background
|
||||||
|
|
|
@ -2,11 +2,10 @@ package app.dapk.st.design.components
|
||||||
|
|
||||||
import androidx.compose.foundation.layout.RowScope
|
import androidx.compose.foundation.layout.RowScope
|
||||||
import androidx.compose.foundation.layout.fillMaxWidth
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
import androidx.compose.foundation.layout.height
|
|
||||||
import androidx.compose.foundation.layout.offset
|
import androidx.compose.foundation.layout.offset
|
||||||
import androidx.compose.material3.*
|
|
||||||
import androidx.compose.material.icons.Icons
|
import androidx.compose.material.icons.Icons
|
||||||
import androidx.compose.material.icons.filled.ArrowBack
|
import androidx.compose.material.icons.filled.ArrowBack
|
||||||
|
import androidx.compose.material3.*
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.graphics.Color
|
import androidx.compose.ui.graphics.Color
|
||||||
|
@ -23,32 +22,22 @@ fun Toolbar(
|
||||||
actions: @Composable RowScope.() -> Unit = {}
|
actions: @Composable RowScope.() -> Unit = {}
|
||||||
) {
|
) {
|
||||||
val navigationIcon = foo(onNavigate)
|
val navigationIcon = foo(onNavigate)
|
||||||
|
|
||||||
SmallTopAppBar(
|
SmallTopAppBar(
|
||||||
modifier = Modifier.height(72.dp).run {
|
modifier = offset?.let { Modifier.offset(it) } ?: Modifier,
|
||||||
if (offset == null) {
|
|
||||||
this
|
|
||||||
} else {
|
|
||||||
this.offset(offset)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
colors = TopAppBarDefaults.smallTopAppBarColors(
|
colors = TopAppBarDefaults.smallTopAppBarColors(
|
||||||
containerColor = MaterialTheme.colorScheme.background
|
containerColor = MaterialTheme.colorScheme.background
|
||||||
),
|
),
|
||||||
navigationIcon = navigationIcon ?: {},
|
navigationIcon = navigationIcon,
|
||||||
title = title?.let {
|
title = title?.let { { Text(it, maxLines = 2) } } ?: {},
|
||||||
{ Text(it, maxLines = 2) }
|
|
||||||
} ?: {},
|
|
||||||
actions = actions,
|
actions = actions,
|
||||||
)
|
)
|
||||||
Divider(modifier = Modifier.fillMaxWidth(), color = Color.Black.copy(alpha = 0.2f), thickness = 0.5.dp)
|
Divider(modifier = Modifier.fillMaxWidth(), color = Color.Black.copy(alpha = 0.2f), thickness = 0.5.dp)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private fun foo(onNavigate: (() -> Unit)?): (@Composable () -> Unit) {
|
||||||
private fun foo(onNavigate: (() -> Unit)?): (@Composable () -> Unit)? {
|
|
||||||
return onNavigate?.let {
|
return onNavigate?.let {
|
||||||
{ NavigationIcon(it) }
|
{ NavigationIcon(it) }
|
||||||
}
|
} ?: {}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
|
|
|
@ -26,7 +26,6 @@ fun HomeScreen(homeViewModel: HomeViewModel) {
|
||||||
homeViewModel.start()
|
homeViewModel.start()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
when (val state = homeViewModel.state) {
|
when (val state = homeViewModel.state) {
|
||||||
Loading -> CenteredLoading()
|
Loading -> CenteredLoading()
|
||||||
is SignedIn -> {
|
is SignedIn -> {
|
||||||
|
@ -76,8 +75,9 @@ private fun BottomBar(state: SignedIn, homeViewModel: HomeViewModel) {
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
Profile -> NavigationBarItem(
|
Profile -> NavigationBarItem(
|
||||||
|
|
||||||
icon = {
|
icon = {
|
||||||
Box(modifier = Modifier.fillMaxHeight()) {
|
Box {
|
||||||
CircleishAvatar(state.me.avatarUrl?.value, state.me.displayName ?: state.me.userId.value, size = 25.dp)
|
CircleishAvatar(state.me.avatarUrl?.value, state.me.displayName ?: state.me.userId.value, size = 25.dp)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue