Merge pull request #17292 from wordpress-mobile/issue/17284-system-bars-background-transparency

[Revamp Landing Screen] Fix system bars background transparency

Author: antonis

WordPress/src/jetpack/java/org/wordpress/android/ui/accounts/login/LoginPrologueRevampedFragment.kt

@@ -5,7 +5,6 @@ import android.content.res.Configuration.UI_MODE_NIGHT_YES
 import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.ViewGroup
-import android.view.WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -32,6 +31,7 @@ import org.wordpress.android.ui.accounts.login.components.PrimaryButton
 import org.wordpress.android.ui.accounts.login.components.SecondaryButton
 import org.wordpress.android.ui.accounts.login.components.TopLinearGradient
 import org.wordpress.android.ui.compose.theme.AppTheme
+import org.wordpress.android.util.extensions.setTransparentSystemBars
 
 val LocalPosition = compositionLocalOf { 0f }
 
@@ -64,12 +64,12 @@ class LoginPrologueRevampedFragment : Fragment() {
 
     override fun onResume() {
         super.onResume()
-        requireActivity().window.addFlags(FLAG_LAYOUT_NO_LIMITS)
+        requireActivity().window.setTransparentSystemBars(true)
     }
 
     override fun onPause() {
         super.onPause()
-        requireActivity().window.clearFlags(FLAG_LAYOUT_NO_LIMITS)
+        requireActivity().window.setTransparentSystemBars(false)
     }
 
     companion object {

WordPress/src/main/AndroidManifest.xml

@@ -100,7 +100,7 @@
             android:label="@string/me_section_screen_title" />
         <activity
             android:name=".ui.accounts.LoginActivity"
-            android:theme="@style/LoginTheme.TransparentStatusBar"
+            android:theme="@style/LoginTheme.TransparentSystemBars"
             android:screenOrientation="portrait"
             android:windowSoftInputMode="adjustResize" />
 

WordPress/src/main/java/org/wordpress/android/util/extensions/WindowExtensions.kt

@@ -7,6 +7,7 @@ import android.view.View.SYSTEM_UI_FLAG_LAYOUT_STABLE
 import android.view.View.SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR
 import android.view.View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR
 import android.view.Window
+import android.view.WindowManager.LayoutParams
 import androidx.core.content.ContextCompat
 import org.wordpress.android.R
 
@@ -43,6 +44,25 @@ fun Window.setLightNavigationBar(showInLightMode: Boolean, applyDefaultColors: B
     }
 }
 
+fun Window.setTransparentSystemBars(isTransparent: Boolean) {
+    when (isTransparent) {
+        true -> {
+            if (VERSION.SDK_INT >= VERSION_CODES.R) {
+                setDecorFitsSystemWindows(false)
+            } else {
+                addFlags(LayoutParams.FLAG_LAYOUT_NO_LIMITS)
+            }
+        }
+        false -> {
+            if (VERSION.SDK_INT >= VERSION_CODES.R) {
+                setDecorFitsSystemWindows(true)
+            } else {
+                clearFlags(LayoutParams.FLAG_LAYOUT_NO_LIMITS)
+            }
+        }
+    }
+}
+
 @Suppress("DEPRECATION")
 fun Window.showFullScreen() {
     decorView.systemUiVisibility = decorView.systemUiVisibility.let {

WordPress/src/main/res/values/styles_login.xml

@@ -8,8 +8,9 @@
         <item name="colorSecondaryVariant">@color/colorSecondaryVariant</item>
     </style>
 
-    <style name="LoginTheme.TransparentStatusBar" parent="LoginTheme">
+    <style name="LoginTheme.TransparentSystemBars" parent="LoginTheme">
         <item name="android:statusBarColor">@android:color/transparent</item>
+        <item name="android:navigationBarColor">@android:color/transparent</item>
     </style>
 
     <style name="Login.EmptyView.TextView.Username" parent="android:Widget.TextView">

WordPress/src/wordpress/java/org/wordpress/android/ui/accounts/login/LoginPrologueRevampedFragment.kt

@@ -5,7 +5,6 @@ import android.content.res.Configuration.UI_MODE_NIGHT_YES
 import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.ViewGroup
-import android.view.WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -34,6 +33,7 @@ import org.wordpress.android.ui.accounts.login.compose.components.PrimaryButton
 import org.wordpress.android.ui.accounts.login.compose.components.SecondaryButton
 import org.wordpress.android.ui.accounts.login.compose.components.Tagline
 import org.wordpress.android.ui.compose.theme.AppTheme
+import org.wordpress.android.util.extensions.setTransparentSystemBars
 
 class LoginPrologueRevampedFragment : Fragment() {
     private lateinit var loginPrologueListener: LoginPrologueListener
@@ -61,12 +61,12 @@ class LoginPrologueRevampedFragment : Fragment() {
 
     override fun onResume() {
         super.onResume()
-        requireActivity().window.addFlags(FLAG_LAYOUT_NO_LIMITS)
+        requireActivity().window.setTransparentSystemBars(true)
     }
 
     override fun onPause() {
         super.onPause()
-        requireActivity().window.clearFlags(FLAG_LAYOUT_NO_LIMITS)
+        requireActivity().window.setTransparentSystemBars(false)
     }
 
     companion object {
@@ -90,7 +90,10 @@ fun LoginScreenRevamped(
             .background(color = colorResource(id = color.login_prologue_revamped_background))
             .drawBehind {
                 scale(scaleX = scaleX, scaleY = 1f) {
-                    translate(left = size.width - brushStrokePainter.intrinsicSize.width - offsetX, top = -offsetY) {
+                    translate(
+                            left = size.width - brushStrokePainter.intrinsicSize.width - offsetX,
+                            top = -offsetY
+                    ) {
                         with(brushStrokePainter) {
                             draw(intrinsicSize)
                         }