From a3550df8938ca78ab182221a7443ff781183dfe0 Mon Sep 17 00:00:00 2001 From: Stanislav Dmitrenko <7953703+avently@users.noreply.github.com> Date: Sat, 10 Aug 2024 05:51:40 +0900 Subject: [PATCH] android, desktop: small layout changes (#4643) * android, desktop: small layout changes * padding * blue theme handling * themedBackground on onboarding * status bar in call * disabled elevation on attachments sheet to prevent seeing shadow from the bottom --------- Co-authored-by: Evgeny Poberezkin --- .../src/main/java/chat/simplex/app/SimplexApp.kt | 15 +++++++++++++-- .../common/views/chatlist/ChatListView.android.kt | 6 +++++- .../chat/simplex/common/views/WelcomeView.kt | 3 ++- .../chat/simplex/common/views/chat/ChatView.kt | 3 +-- .../views/onboarding/CreateSimpleXAddress.kt | 3 ++- .../common/views/onboarding/LinkAMobileView.kt | 3 ++- .../views/onboarding/SetNotificationsMode.kt | 1 + .../views/onboarding/SetupDatabasePassphrase.kt | 2 +- .../common/views/onboarding/SimpleXInfo.kt | 8 ++++---- .../common/views/usersettings/SettingsView.kt | 5 ++--- 10 files changed, 33 insertions(+), 16 deletions(-) diff --git a/apps/multiplatform/android/src/main/java/chat/simplex/app/SimplexApp.kt b/apps/multiplatform/android/src/main/java/chat/simplex/app/SimplexApp.kt index c8ca0d8489..9206b5be89 100644 --- a/apps/multiplatform/android/src/main/java/chat/simplex/app/SimplexApp.kt +++ b/apps/multiplatform/android/src/main/java/chat/simplex/app/SimplexApp.kt @@ -26,6 +26,7 @@ import chat.simplex.common.model.ChatModel.withChats import chat.simplex.common.platform.* import chat.simplex.common.ui.theme.* import chat.simplex.common.views.call.* +import chat.simplex.common.views.chatlist.statusBarColorAfterCall import chat.simplex.common.views.helpers.* import chat.simplex.common.views.onboarding.OnboardingStage import com.jakewharton.processphoenix.ProcessPhoenix @@ -276,11 +277,21 @@ class SimplexApp: Application(), LifecycleEventObserver { @Suppress("DEPRECATION") val windowInsetController = ViewCompat.getWindowInsetsController(window.decorView) - val statusBar = (if (hasTop && appPrefs.onboardingStage.get() == OnboardingStage.OnboardingComplete) { + var statusBar = (if (hasTop && appPrefs.onboardingStage.get() == OnboardingStage.OnboardingComplete) { backgroundColor.mixWith(CurrentColors.value.colors.onBackground, 0.97f) } else { - backgroundColor + if (CurrentColors.value.base == DefaultTheme.SIMPLEX) { + backgroundColor.lighter(0.4f) + } else { + backgroundColor + } }).toArgb() + + // SimplexGreen while in call + if (window.statusBarColor == SimplexGreen.toArgb()) { + statusBarColorAfterCall.intValue = statusBar + statusBar = SimplexGreen.toArgb() + } val navBar = (if (hasBottom && appPrefs.onboardingStage.get() == OnboardingStage.OnboardingComplete) { backgroundColor.mixWith(CurrentColors.value.colors.onBackground, 0.97f) } else { diff --git a/apps/multiplatform/common/src/androidMain/kotlin/chat/simplex/common/views/chatlist/ChatListView.android.kt b/apps/multiplatform/common/src/androidMain/kotlin/chat/simplex/common/views/chatlist/ChatListView.android.kt index db56eeb508..3283593e09 100644 --- a/apps/multiplatform/common/src/androidMain/kotlin/chat/simplex/common/views/chatlist/ChatListView.android.kt +++ b/apps/multiplatform/common/src/androidMain/kotlin/chat/simplex/common/views/chatlist/ChatListView.android.kt @@ -64,6 +64,9 @@ actual fun ActiveCallInteractiveArea(call: Call) { } } +// Temporary solution for storing a color that needs to be applied after call ends +var statusBarColorAfterCall = mutableIntStateOf(CurrentColors.value.colors.background.toArgb()) + @Composable private fun GreenLine(call: Call) { Row( @@ -81,9 +84,10 @@ private fun GreenLine(call: Call) { } val window = (LocalContext.current as Activity).window DisposableEffect(Unit) { + statusBarColorAfterCall.intValue = window.statusBarColor window.statusBarColor = SimplexGreen.toArgb() onDispose { - window.statusBarColor = Color.Black.toArgb() + window.statusBarColor = statusBarColorAfterCall.intValue } } } diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/WelcomeView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/WelcomeView.kt index 53f494a5f7..e90a581416 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/WelcomeView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/WelcomeView.kt @@ -115,7 +115,8 @@ fun CreateFirstProfile(chatModel: ChatModel, close: () -> Unit) { ProvideWindowInsets(windowInsetsAnimationsEnabled = true) { Column( modifier = Modifier - .fillMaxSize(), + .fillMaxSize() + .themedBackground(), horizontalAlignment = Alignment.CenterHorizontally ) { CloseSheetBar(close = { diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/chat/ChatView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/chat/ChatView.kt index c0a7775040..ecca3edebd 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/chat/ChatView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/chat/ChatView.kt @@ -623,11 +623,10 @@ fun ChatLayout( ) ) { ProvideWindowInsets(windowInsetsAnimationsEnabled = true) { - val elevation = remember { derivedStateOf { if (attachmentBottomSheetState.currentValue == ModalBottomSheetValue.Hidden) 0.dp else ModalBottomSheetDefaults.Elevation } } ModalBottomSheetLayout( scrimColor = Color.Black.copy(alpha = 0.12F), modifier = Modifier.navigationBarsWithImePadding(), - sheetElevation = elevation.value, + sheetElevation = 0.dp, sheetContent = { ChooseAttachmentView( attachmentOption, diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/CreateSimpleXAddress.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/CreateSimpleXAddress.kt index 027d977ada..fddf964f28 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/CreateSimpleXAddress.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/CreateSimpleXAddress.kt @@ -78,7 +78,8 @@ private fun CreateSimpleXAddressLayout( ) { ColumnWithScrollBar( Modifier - .fillMaxSize(), + .fillMaxSize() + .themedBackground(), horizontalAlignment = Alignment.CenterHorizontally, ) { CloseSheetBar(showClose = false, close = {}) diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/LinkAMobileView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/LinkAMobileView.kt index 5627582956..f0e34218d1 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/LinkAMobileView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/LinkAMobileView.kt @@ -15,6 +15,7 @@ import chat.simplex.common.model.ChatModel import chat.simplex.common.platform.BackHandler import chat.simplex.common.platform.chatModel import chat.simplex.common.ui.theme.DEFAULT_PADDING +import chat.simplex.common.ui.theme.themedBackground import chat.simplex.common.views.helpers.* import chat.simplex.common.views.remote.AddingMobileDevice import chat.simplex.common.views.remote.DeviceNameField @@ -58,7 +59,7 @@ private fun LinkAMobileLayout( staleQrCode: MutableState, updateDeviceName: (String) -> Unit, ) { - Column { + Column(Modifier.themedBackground()) { CloseSheetBar(close = { appPrefs.onboardingStage.set(OnboardingStage.Step1_SimpleXInfo) }) diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetNotificationsMode.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetNotificationsMode.kt index 81e99370f0..96e1ce8e34 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetNotificationsMode.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetNotificationsMode.kt @@ -28,6 +28,7 @@ fun SetNotificationsMode(m: ChatModel) { ColumnWithScrollBar( modifier = Modifier .fillMaxSize() + .themedBackground() ) { CloseSheetBar(showClose = false, close = {}) AppBarTitle(stringResource(MR.strings.onboarding_notifications_mode_title)) diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetupDatabasePassphrase.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetupDatabasePassphrase.kt index 0239ddb8e5..7a1b7cccb4 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetupDatabasePassphrase.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SetupDatabasePassphrase.kt @@ -105,7 +105,7 @@ private fun SetupDatabasePassphraseLayout( nextStep: () -> Unit, ) { ColumnWithScrollBar( - Modifier.fillMaxSize().padding(bottom = DEFAULT_PADDING * 2), + Modifier.fillMaxSize().themedBackground().padding(bottom = DEFAULT_PADDING * 2), horizontalAlignment = Alignment.CenterHorizontally, ) { CloseSheetBar(showClose = false, close = {}) diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SimpleXInfo.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SimpleXInfo.kt index 57e15a37c3..c176950902 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SimpleXInfo.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/onboarding/SimpleXInfo.kt @@ -57,7 +57,7 @@ fun SimpleXInfoLayout( ColumnWithScrollBar( Modifier .fillMaxSize() - .padding(horizontal = 16.dp), + .padding(horizontal = DEFAULT_PADDING), horizontalAlignment = Alignment.CenterHorizontally ) { Box(Modifier.widthIn(max = if (appPlatform.isAndroid) 250.dp else 500.dp).padding(top = DEFAULT_PADDING + 8.dp), contentAlignment = Alignment.Center) { @@ -75,7 +75,7 @@ fun SimpleXInfoLayout( Spacer(Modifier.weight(1f)) - Column(Modifier.fillMaxWidth()) { + Column { InfoRow(painterResource(MR.images.privacy), MR.strings.privacy_redefined, MR.strings.first_platform_without_user_ids, width = 60.dp) InfoRow(painterResource(MR.images.shield), MR.strings.immune_to_spam_and_abuse, MR.strings.people_can_connect_only_via_links_you_share, width = 46.dp) InfoRow(painterResource(if (isInDarkTheme()) MR.images.decentralized_light else MR.images.decentralized), MR.strings.decentralized, MR.strings.opensource_protocol_and_code_anybody_can_run_servers) @@ -115,10 +115,10 @@ fun SimpleXLogo() { @Composable private fun InfoRow(icon: Painter, titleId: StringResource, textId: StringResource, width: Dp = 58.dp) { Row(Modifier.padding(bottom = 27.dp), verticalAlignment = Alignment.Top) { - Spacer(Modifier.width((18.dp + 58.dp - width) / 2)) + Spacer(Modifier.width((4.dp + 58.dp - width) / 2)) Image(icon, contentDescription = null, modifier = Modifier .width(width)) - Spacer(Modifier.width((18.dp + 58.dp - width) / 2 + DEFAULT_PADDING_HALF)) + Spacer(Modifier.width((4.dp + 58.dp - width) / 2 + DEFAULT_PADDING_HALF + 7.dp)) Column(Modifier.padding(top = 4.dp), verticalArrangement = Arrangement.spacedBy(DEFAULT_PADDING_HALF)) { Text(stringResource(titleId), fontWeight = FontWeight.Bold, style = MaterialTheme.typography.h3, lineHeight = 24.sp) Text(stringResource(textId), lineHeight = 24.sp, style = MaterialTheme.typography.body1, color = MaterialTheme.colors.secondary) diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/usersettings/SettingsView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/usersettings/SettingsView.kt index 442bced4d9..68315aec2c 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/usersettings/SettingsView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/usersettings/SettingsView.kt @@ -180,11 +180,10 @@ fun SettingsLayout( .height(AppBarHeight * fontSizeSqrtMultiplier) .background(MaterialTheme.colors.background) .background(if (isInDarkTheme()) ToolbarDark else ToolbarLight) - .padding(start = 4.dp, top = 8.dp), + .padding(start = 4.dp), contentAlignment = Alignment.CenterStart ) { - val sp24 = with(LocalDensity.current) { 24.sp.toDp() } - NavigationButtonBack(closeSettings, height = sp24) + NavigationButtonBack(closeSettings, height = 24.sp.toDp()) } } }