applying dynamic colour scheme and fixing appbar/navbar quirks

This commit is contained in:
Adam Brown 2022-09-04 15:35:50 +01:00 committed by Adam Brown
parent 692e179e3f
commit ef7af20853
3 changed files with 11 additions and 19 deletions

View File

@ -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

View File

@ -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

View File

@ -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)
} }
}, },