Status bar and navigation bar styles updated

openMF · Oct 10, 2024 · 26379d6 · 26379d6
1 parent 771fbda
commit 26379d6
Show file tree

Hide file tree

Showing 7 changed files with 77 additions and 27 deletions.
diff --git a/androidApp/src/main/kotlin/org/mifos/mobile/HomeActivity.kt b/androidApp/src/main/kotlin/org/mifos/mobile/HomeActivity.kt
@@ -9,15 +9,20 @@
  */
 package org.mifos.mobile
 
+import android.graphics.Color
 import android.os.Bundle
 import androidx.activity.ComponentActivity
+import androidx.activity.SystemBarStyle
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
 import androidx.activity.viewModels
+import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.DisposableEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.setValue
+import androidx.compose.ui.graphics.toArgb
 import androidx.core.splashscreen.SplashScreen.Companion.installSplashScreen
 import androidx.lifecycle.Lifecycle
 import androidx.lifecycle.lifecycleScope
@@ -30,6 +35,8 @@ import kotlinx.coroutines.launch
 import org.mifos.mobile.HomeActivityUiState.Success
 import org.mifos.mobile.core.data.utils.NetworkMonitor
 import org.mifos.mobile.core.designsystem.theme.MifosMobileTheme
+import org.mifos.mobile.core.designsystem.theme.darkScrim
+import org.mifos.mobile.core.designsystem.theme.lightScrim
 import org.mifos.mobile.navigation.MifosNavGraph.AUTH_GRAPH
 import org.mifos.mobile.navigation.MifosNavGraph.PASSCODE_GRAPH
 import org.mifos.mobile.navigation.RootNavGraph
@@ -73,6 +80,8 @@ class HomeActivity : ComponentActivity() {
 
             val appState = rememberMifosMobileState(networkMonitor = networkMonitor)
 
+            val darkTheme = isSystemInDarkTheme()
+
             val navDestination = when (uiState) {
                 is Success -> if ((uiState as Success).userData.isAuthenticated) {
                     PASSCODE_GRAPH
@@ -83,6 +92,20 @@ class HomeActivity : ComponentActivity() {
                 else -> AUTH_GRAPH
             }
 
+            DisposableEffect(darkTheme) {
+                enableEdgeToEdge(
+                    statusBarStyle = SystemBarStyle.auto(
+                        Color.TRANSPARENT,
+                        Color.TRANSPARENT,
+                    ) { darkTheme },
+                    navigationBarStyle = SystemBarStyle.auto(
+                        lightScrim.toArgb(),
+                        darkScrim.toArgb()
+                    ) { darkTheme },
+                )
+                onDispose {}
+            }
+
             CompositionLocalProvider {
                 MifosMobileTheme {
                     RootNavGraph(

diff --git a/androidApp/src/main/res/values-night/color.xml b/androidApp/src/main/res/values-night/color.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="status_bar">#FF1B1B1F</color> // dark/color.xml
+</resources>
diff --git a/androidApp/src/main/res/values-night/theme.xml b/androidApp/src/main/res/values-night/theme.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources xmlns:tools="http://schemas.android.com/tools">
+
+    <style name="NightAdjusted.Theme" parent="android:Theme.Material.NoActionBar">
+        <item name="android:statusBarColor">@color/status_bar</item>
+    </style>
+
+    <style name="NightAdjusted.Theme.Splash" parent="Theme.SplashScreen">
+        <item name="android:windowLightNavigationBar" tools:targetApi="27">false</item>
+    </style>
+
+</resources>
diff --git a/androidApp/src/main/res/values/colors.xml b/androidApp/src/main/res/values/colors.xml
@@ -54,6 +54,7 @@
     <color name="gray_bright">#33CCCCCC</color>
 
     <!-- Material design colors -->
+    <color name="status_bar">#FFFEFBFF</color>
 
     <!-- New UI color palette -->
     <!--<color name="primary">#068799</color>-->

diff --git a/androidApp/src/main/res/values/splash.xml b/androidApp/src/main/res/values/splash.xml
@@ -8,18 +8,40 @@
 
     See https://github.com/openMF/mobile-mobile/blob/master/LICENSE.md
 -->
-<resources>
-    <style name="Theme.MifosSplash" parent="Theme.SplashScreen">
-        <item name="windowSplashScreenBackground">#FFFDFDF5</item>
-        <item name="windowSplashScreenAnimatedIcon">@drawable/splash_icon</item>
-        <item name="postSplashScreenTheme">@style/AppTheme</item>
-        <item name="windowSplashScreenAnimationDuration">10</item>
+<resources xmlns:tools="http://schemas.android.com/tools">
+<!--    <style name="Theme.MifosSplash" parent="Theme.SplashScreen">-->
+<!--        <item name="windowSplashScreenBackground">#FFFDFDF5</item>-->
+<!--        <item name="windowSplashScreenAnimatedIcon">@drawable/splash_icon</item>-->
+<!--        <item name="postSplashScreenTheme">@style/AppTheme</item>-->
+<!--        <item name="windowSplashScreenAnimationDuration">10</item>-->
+<!--    </style>-->
+
+<!--    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">-->
+<!--        <item name="android:statusBarColor">@color/background</item>-->
+<!--        <item name="android:windowLightStatusBar">true</item>-->
+<!--        <item name="android:windowContentOverlay">@null</item>-->
+<!--        <item name="android:windowIsTranslucent">true</item>-->
+<!--    </style>-->
+
+<!--    <style name="NightAdjusted.Theme" parent="android:Theme.Material.Light.NoActionBar">-->
+<!--        <item name="android:statusBarColor">@color/status_bar</item>-->
+<!--    </style>-->
+
+    <!-- Allows us to override night specific attributes in the
+    values-night folder. -->
+    <style name="NightAdjusted.Theme" parent="android:Theme.Material.Light.NoActionBar">
+        <item name="android:statusBarColor">@color/status_bar</item>
     </style>
 
-    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
-        <item name="android:statusBarColor">@color/background</item>
-        <item name="android:windowLightStatusBar">true</item>
-        <item name="android:windowContentOverlay">@null</item>
-        <item name="android:windowIsTranslucent">true</item>
+    <!-- The final theme we use -->
+    <style name="Theme.MifosSplash" parent="NightAdjusted.Theme" />
+
+    <style name="NightAdjusted.Theme.Splash" parent="Theme.SplashScreen">
+        <item name="android:windowLightNavigationBar" tools:targetApi="27">true</item>
+    </style>
+
+    <style name="Theme.Mifos.Splash" parent="NightAdjusted.Theme.Splash">
+        <item name="windowSplashScreenAnimatedIcon">@drawable/splash_icon</item>
+        <item name="postSplashScreenTheme">@style/Theme.MifosSplash</item>
     </style>
 </resources>
diff --git a/core/designsystem/src/main/kotlin/org/mifos/mobile/core/designsystem/theme/Color.kt b/core/designsystem/src/main/kotlin/org/mifos/mobile/core/designsystem/theme/Color.kt
@@ -35,3 +35,6 @@ val DarkGray = Color(0xBB666666)
 val GreenSuccess = Color(0xff14c416)
 val LightSurfaceTint = Color(0xFF325CA8)
 val DarkSurfaceTint = Color(0xFFAEC6FF)
+
+val lightScrim = Color(0x80FFFFFF)  // Light scrim with 50% opacity
+val darkScrim = Color(0x80000000)   // Dark scrim with 50% opacity
diff --git a/core/designsystem/src/main/kotlin/org/mifos/mobile/core/designsystem/theme/Theme.kt b/core/designsystem/src/main/kotlin/org/mifos/mobile/core/designsystem/theme/Theme.kt
@@ -9,18 +9,12 @@
  */
 package org.mifos.mobile.core.designsystem.theme
 
-import android.app.Activity
 import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.darkColorScheme
 import androidx.compose.material3.lightColorScheme
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.SideEffect
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.toArgb
-import androidx.compose.ui.platform.LocalView
-import androidx.core.view.WindowCompat
-import androidx.core.view.WindowInsetsControllerCompat
 
 private val LightThemeColors = lightColorScheme(
     primary = LightPrimary,
@@ -39,7 +33,7 @@ private val DarkThemeColors = darkColorScheme(
     secondary = Black1,
     error = RedErrorDark,
     background = BackgroundDark,
-    surface = Black1,
+    surface = BackgroundDark,
     onSurface = Color.White,
     onSecondary = Color.White,
     outlineVariant = Color.White,
@@ -56,15 +50,6 @@ fun MifosMobileTheme(
         else -> LightThemeColors
     }
 
-    val view = LocalView.current
-    if (!view.isInEditMode) {
-        SideEffect {
-            val window = (view.context as Activity).window
-            WindowCompat.setDecorFitsSystemWindows(window, false)
-            WindowInsetsControllerCompat(window, window.decorView).isAppearanceLightStatusBars = true
-        }
-    }
-
     MaterialTheme(
         colorScheme = colors,
         content = content,