From 48731f130e92dc55ab692f2fc9cd8419c1c65734 Mon Sep 17 00:00:00 2001 From: Roman Makeev <57789105+makeevrserg@users.noreply.github.com> Date: Mon, 13 May 2024 13:07:47 +0300 Subject: [PATCH] Fix/settings statusbar padding (#853) **Background** On settings/options screen Composable doesn't have `statusBarsPaddings` **Changes** - Added `SafeStatusBarBox` to handle both overscroll effect and different colors for status bar, background content **Test plan** - Open options screen - Scroll down - See there's now status bar on top --- CHANGELOG.md | 1 + .../impl/composable/ComposableSettings.kt | 105 ++++++++++++------ 2 files changed, 71 insertions(+), 35 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index cb11234095..67e7edfdb6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -30,6 +30,7 @@ - [FIX] Wrong error display on categories screen when no internet connection - [FIX] Using third-party Github Action Setup Android SDK for baseline profile generation - [FIX] Manifest dev catalog flag on installed apps +- [FIX] Settings status bar overflow content - [FIX] Fix TopBar above system bar in file manager file edit screen - [Feature] Add not connected, empty and syncing states to emulation button on key screen - [Feature] Check app exist on apps catalog manifest loading diff --git a/components/settings/impl/src/main/java/com/flipperdevices/settings/impl/composable/ComposableSettings.kt b/components/settings/impl/src/main/java/com/flipperdevices/settings/impl/composable/ComposableSettings.kt index a4f7231d24..27058c921c 100644 --- a/components/settings/impl/src/main/java/com/flipperdevices/settings/impl/composable/ComposableSettings.kt +++ b/components/settings/impl/src/main/java/com/flipperdevices/settings/impl/composable/ComposableSettings.kt @@ -2,14 +2,19 @@ package com.flipperdevices.settings.impl.composable import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.statusBarsPadding import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.verticalScroll import androidx.compose.runtime.Composable import androidx.compose.runtime.collectAsState import androidx.compose.runtime.getValue import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.unit.dp import com.flipperdevices.core.ui.ktx.OrangeAppBar @@ -47,45 +52,75 @@ fun ComposableSettings( val exportState by settingsViewModel.getExportState().collectAsState() val notificationState by notificationViewModel.getNotificationToggleState().collectAsState() - Column( + SafeStatusBarBox(modifier = modifier) { + Column( + modifier = Modifier + .fillMaxSize() + .verticalScroll(rememberScrollState()) + .background(LocalPallet.current.background), + verticalArrangement = Arrangement.spacedBy(14.dp) + ) { + OrangeAppBar(R.string.options, onBack = onBack) + AppCategory( + theme = settings.selectedTheme, + onSelectTheme = settingsViewModel::onChangeSelectedTheme, + notificationState = notificationState, + onChangeNotificationState = notificationViewModel::switchToggle + ) + if (settings.expertMode) { + DebugCategory( + settings = settings, + onSwitchDebug = settingsViewModel::onSwitchDebug, + onAction = onDebugAction, + onDebugSettingSwitch = debugViewModel::onSwitch + ) + } + ExperimentalCategory( + settings = settings, + onSwitchExperimental = settingsViewModel::onSwitchExperimental, + onOpenFM = { onOpen(SettingsNavigationConfig.FileManager) } + ) + ExportKeysCategory( + exportState = exportState, + onExport = { settingsViewModel.onMakeExport(context) } + ) + OtherSettingsCategory( + s2rInitialized = s2rInitialized, + onReportBug = { onOpen(SettingsNavigationConfig.Shake2Report) } + ) + @Suppress("ViewModelForwarding") + VersionCategory( + onActivateExpertMode = settingsViewModel::onExpertModeActivate, + versionViewModel = versionViewModel + ) + } + } +} + +@Composable +private fun SafeStatusBarBox( + modifier: Modifier = Modifier, + statusBarColor: Color = LocalPallet.current.accent, + backgroundColor: Color = LocalPallet.current.background, + content: @Composable () -> Unit +) { + Box( modifier = modifier .fillMaxSize() - .verticalScroll(rememberScrollState()) - .background(LocalPallet.current.background), - verticalArrangement = Arrangement.spacedBy(14.dp) + .background(statusBarColor) + .statusBarsPadding() + .background(backgroundColor) ) { - OrangeAppBar(R.string.options, onBack = onBack) - AppCategory( - theme = settings.selectedTheme, - onSelectTheme = settingsViewModel::onChangeSelectedTheme, - notificationState = notificationState, - onChangeNotificationState = notificationViewModel::switchToggle - ) - if (settings.expertMode) { - DebugCategory( - settings = settings, - onSwitchDebug = settingsViewModel::onSwitchDebug, - onAction = onDebugAction, - onDebugSettingSwitch = debugViewModel::onSwitch + // Used to fill overflow color on top of StatusBars + if (statusBarColor != backgroundColor) { + Box( + modifier = Modifier + .background(statusBarColor) + .statusBarsPadding() + .fillMaxWidth() + .padding(vertical = 20.dp) ) } - ExperimentalCategory( - settings = settings, - onSwitchExperimental = settingsViewModel::onSwitchExperimental, - onOpenFM = { onOpen(SettingsNavigationConfig.FileManager) } - ) - ExportKeysCategory( - exportState = exportState, - onExport = { settingsViewModel.onMakeExport(context) } - ) - OtherSettingsCategory( - s2rInitialized = s2rInitialized, - onReportBug = { onOpen(SettingsNavigationConfig.Shake2Report) } - ) - @Suppress("ViewModelForwarding") - VersionCategory( - onActivateExpertMode = settingsViewModel::onExpertModeActivate, - versionViewModel = versionViewModel - ) + content.invoke() } }