update:add status bar mask

app/src/main/java/com/aiosman/riderpro/FollowerPage.kt

@@ -5,13 +5,10 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.WindowInsets
-import androidx.compose.foundation.layout.asPaddingValues
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.layout.systemBars
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material3.Text
@@ -24,25 +21,12 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import com.google.accompanist.systemuicontroller.rememberSystemUiController
 
 @Preview
 @Composable
 fun FollowerPage() {
-    val paddingValues = WindowInsets.systemBars.asPaddingValues()
+    StatusBarMaskLayout(
-    val systemUiController = rememberSystemUiController()
+        modifier = Modifier.padding(horizontal = 16.dp)
-    systemUiController.setStatusBarColor(Color.Transparent,darkIcons = true)
-    Spacer(modifier=Modifier.height(paddingValues.calculateTopPadding()))
-    Column {
-        Box(
-            modifier = Modifier
-                .height(paddingValues.calculateTopPadding())
-                .fillMaxWidth()
-//                .background(Color.Black)
-        )
-        Column(
-            modifier = Modifier
-                .padding(start = 16.dp, end = 16.dp)
     ) {
         NoticeScreenHeader("FOLLOWERS")
         Spacer(modifier = Modifier.height(28.dp))
@@ -54,8 +38,6 @@ fun FollowerPage() {
                     FollowerItem()
                 }
             }
-
-            }
         }
     }
 }

app/src/main/java/com/aiosman/riderpro/StatusBarMask.kt

@@ -0,0 +1,45 @@
+package com.aiosman.riderpro
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.systemBars
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import com.google.accompanist.systemuicontroller.rememberSystemUiController
+
+@Composable
+fun StatusBarMask(darkIcons: Boolean = true) {
+    val paddingValues = WindowInsets.systemBars.asPaddingValues()
+    val systemUiController = rememberSystemUiController()
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Transparent, darkIcons = darkIcons)
+
+    }
+    Spacer(modifier = Modifier.height(paddingValues.calculateTopPadding()))
+
+}
+
+@Composable
+fun StatusBarMaskLayout(
+    modifier: Modifier = Modifier,
+    darkIcons: Boolean = true,
+    content: @Composable ColumnScope.() -> Unit
+) {
+    val paddingValues = WindowInsets.systemBars.asPaddingValues()
+    val systemUiController = rememberSystemUiController()
+    LaunchedEffect(Unit) {
+        systemUiController.setStatusBarColor(Color.Transparent, darkIcons = darkIcons)
+    }
+    Column(
+        modifier = modifier
+    ) {
+        Spacer(modifier = Modifier.height(paddingValues.calculateTopPadding()))
+        content()
+    }
+}