Feature/boolti 343 edge to edge 활성화 및 스타일 반영

presentation/src/main/java/com/nexters/boolti/presentation/QrScanActivity.kt

@@ -1,10 +1,13 @@
 package com.nexters.boolti.presentation
 
 import android.Manifest
+import android.graphics.Color
 import android.os.Bundle
 import android.view.KeyEvent
 import androidx.activity.ComponentActivity
+import androidx.activity.SystemBarStyle
 import androidx.activity.compose.setContent
+import androidx.activity.enableEdgeToEdge
 import androidx.activity.viewModels
 import androidx.core.view.isVisible
 import androidx.lifecycle.Lifecycle
@@ -54,6 +57,8 @@ class QrScanActivity : ComponentActivity() {
 
         requestPermission(Manifest.permission.CAMERA, 100)
 
+        enableEdgeToEdge(statusBarStyle = SystemBarStyle.dark(Color.TRANSPARENT))
+
         setContent {
             BooltiTheme {
                 QrScanScreen(

presentation/src/main/java/com/nexters/boolti/presentation/component/BtAppBar.kt

@@ -8,6 +8,7 @@ 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.statusBarsPadding
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
@@ -35,12 +36,14 @@ fun BtAppBar(
     modifier: Modifier = Modifier,
     title: String = "",
     colors: BtAppBarColors = BtAppBarDefaults.appBarColors(),
+    statusBarPadding: Boolean = true,
     navigateButtons: @Composable (RowScope.() -> Unit)? = null,
     actionButtons: @Composable (RowScope.() -> Unit)? = null,
 ) {
     Row(
         modifier = modifier
             .background(color = colors.containerColor)
+            .let { if (statusBarPadding) it.statusBarsPadding() else it }
             .fillMaxWidth()
             .height(44.dp)
             .padding(horizontal = 8.dp),
@@ -80,13 +83,15 @@ fun BtAppBar(
     modifier: Modifier = Modifier,
     title: String = "",
     colors: BtAppBarColors = BtAppBarDefaults.appBarColors(),
+    statusBarPadding: Boolean = true,
     navigationButtons: List<Pair<Int, () -> Unit>> = emptyList(),
     actionButtons: List<Pair<Int, () -> Unit>> = emptyList(),
 ) {
     BtAppBar(
         modifier = modifier,
         title = title,
         colors = colors,
+        statusBarPadding = statusBarPadding,
         navigateButtons = if (navigationButtons.isNotEmpty()) {
             {
                 navigationButtons.forEach { (res, onClick) ->
@@ -113,6 +118,7 @@ fun BtBackAppBar(
     modifier: Modifier = Modifier,
     title: String = "",
     colors: BtAppBarColors = BtAppBarDefaults.appBarColors(),
+    statusBarPadding: Boolean = true,
     onClickBack: () -> Unit,
 ) {
     BtAppBar(
@@ -125,6 +131,7 @@ fun BtBackAppBar(
             )
         },
         colors = colors,
+        statusBarPadding = statusBarPadding,
     )
 }
 
@@ -133,6 +140,7 @@ fun BtCloseableAppBar(
     modifier: Modifier = Modifier,
     title: String = "",
     colors: BtAppBarColors = BtAppBarDefaults.appBarColors(),
+    statusBarPadding: Boolean = true,
     onClickClose: () -> Unit,
 ) {
     BtAppBar(
@@ -146,6 +154,7 @@ fun BtCloseableAppBar(
             )
         },
         colors = colors,
+        statusBarPadding = statusBarPadding,
     )
 }
 

presentation/src/main/java/com/nexters/boolti/presentation/component/StatusBarCover.kt

@@ -0,0 +1,29 @@
+package com.nexters.boolti.presentation.component
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.ExperimentalLayoutApi
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.statusBarsIgnoringVisibility
+import androidx.compose.foundation.layout.windowInsetsTopHeight
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.zIndex
+
+@OptIn(ExperimentalLayoutApi::class)
+@Composable
+fun StatusBarCover(
+    modifier: Modifier = Modifier,
+    color: Color = MaterialTheme.colorScheme.background,
+) {
+    Box(
+        modifier = modifier
+            .zIndex(1f)
+            .background(color)
+            .fillMaxWidth()
+            .windowInsetsTopHeight(WindowInsets.statusBarsIgnoringVisibility),
+    )
+}

presentation/src/main/java/com/nexters/boolti/presentation/reservationdetail/ReservationDetailScreen.kt

@@ -10,6 +10,7 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.rememberScrollState
@@ -74,7 +75,7 @@ fun ReservationDetailScreen(
     }
 
     Scaffold(
-        modifier = modifier,
+        modifier = modifier.navigationBarsPadding(),
         topBar = {
             BtBackAppBar(
                 title = stringResource(id = R.string.reservation_detail),
@@ -143,7 +144,8 @@ fun ReservationDetailScreen(
             if (state.reservation.isRefundable) {
                 MainButton(
                     modifier = modifier
-                        .padding(horizontal = marginHorizontal, vertical = 8.dp)
+                        .padding(horizontal = marginHorizontal)
+                        .padding(top = 8.dp, bottom = 20.dp)
                         .fillMaxWidth(),
                     colors = MainButtonDefaults.buttonColors(
                         containerColor = Grey15,

presentation/src/main/java/com/nexters/boolti/presentation/screen/Main.kt

@@ -1,11 +1,11 @@
 package com.nexters.boolti.presentation.screen
 
+import android.annotation.SuppressLint
 import android.content.Intent
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.SnackbarHostState
-import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.remember
@@ -58,33 +58,32 @@ val LocalSnackbarController = staticCompositionLocalOf {
     SnackbarController(SnackbarHostState())
 }
 
+@SuppressLint("UnusedMaterial3ScaffoldPaddingParameter")
 @Composable
 fun Main(onClickQrScan: (showId: String, showName: String) -> Unit) {
     val modifier = Modifier.fillMaxSize()
     val scope = rememberCoroutineScope()
     val snackbarHostState = remember { SnackbarHostState() }
 
     BooltiTheme {
-        Surface(modifier) {
-            Scaffold(
-                snackbarHost = {
-                    ToastSnackbarHost(
-                        modifier = Modifier.padding(bottom = 80.dp),
-                        hostState = snackbarHostState,
-                    )
-                },
-            ) { innerPadding ->
-                CompositionLocalProvider(
-                    LocalSnackbarController provides SnackbarController(
-                        snackbarHostState,
-                        scope
-                    )
-                ) {
-                    MainNavigation(
-                        modifier = modifier.padding(innerPadding),
-                        onClickQrScan = onClickQrScan,
-                    )
-                }
+        Scaffold(
+            snackbarHost = {
+                ToastSnackbarHost(
+                    modifier = Modifier.padding(bottom = 80.dp),
+                    hostState = snackbarHostState,
+                )
+            },
+        ) {
+            CompositionLocalProvider(
+                LocalSnackbarController provides SnackbarController(
+                    snackbarHostState,
+                    scope
+                )
+            ) {
+                MainNavigation(
+                    modifier = modifier,
+                    onClickQrScan = onClickQrScan,
+                )
             }
         }
     }

presentation/src/main/java/com/nexters/boolti/presentation/screen/MainActivity.kt

@@ -3,10 +3,13 @@ package com.nexters.boolti.presentation.screen
 import android.Manifest
 import android.app.NotificationChannel
 import android.app.NotificationManager
+import android.graphics.Color
 import android.os.Build
 import android.os.Bundle
 import androidx.activity.ComponentActivity
+import androidx.activity.SystemBarStyle
 import androidx.activity.compose.setContent
+import androidx.activity.enableEdgeToEdge
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
@@ -26,6 +29,9 @@ import timber.log.Timber
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
+        enableEdgeToEdge(
+            statusBarStyle = SystemBarStyle.dark(Color.TRANSPARENT),
+        )
         setContent {
             BooltiTheme {
                 Surface(

presentation/src/main/java/com/nexters/boolti/presentation/screen/home/HomeScreen.kt

@@ -138,7 +138,7 @@ fun HomeScreen(
                 )
             ) {
                 ShowScreen(
-                    modifier = modifier.padding(innerPadding),
+                    modifier = Modifier.padding(bottom = innerPadding.calculateBottomPadding()),
                     onClickShowItem = onClickShowItem,
                     navigateToBusiness = navigateToBusiness,
                     navigateToShowRegistration = {

presentation/src/main/java/com/nexters/boolti/presentation/screen/qr/QrFullScreen.kt

@@ -1,6 +1,5 @@
 package com.nexters.boolti.presentation.screen.qr
 
-import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
@@ -13,6 +12,7 @@ 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.statusBarsPadding
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.pager.HorizontalPager
 import androidx.compose.foundation.pager.rememberPagerState
@@ -69,7 +69,6 @@ fun NavGraphBuilder.QrFullScreen(
     }
 }
 
-@OptIn(ExperimentalFoundationApi::class)
 @Composable
 fun QrFullScreen(
     modifier: Modifier = Modifier,
@@ -81,12 +80,17 @@ fun QrFullScreen(
 
     Scaffold(
         modifier = modifier,
-        topBar = { Toolbar(onClose = onClose) },
+        topBar = {
+            Toolbar(
+                modifier = Modifier.statusBarsPadding(),
+                onClose = onClose,
+            )
+        },
     ) { innerPadding ->
         Box(
             modifier = Modifier
                 .fillMaxSize()
-                .background(Color.White)
+                .background(White)
                 .padding(innerPadding),
         ) {
             HorizontalPager(

presentation/src/main/java/com/nexters/boolti/presentation/screen/qr/QrScanScreen.kt

@@ -7,6 +7,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
@@ -75,9 +76,20 @@ fun QrScanScreen(
                 val (iconId, errMessage) = when (event) {
                     is QrScanEvent.ScanError -> {
                         when (event.errorType) {
-                            QrErrorType.ShowNotToday -> Pair(R.drawable.ic_warning, notTodayErrMessage)
-                            QrErrorType.UsedTicket -> Pair(R.drawable.ic_error, usedTicketErrMessage)
-                            QrErrorType.TicketNotFound -> Pair(R.drawable.ic_error, notMatchedErrMessage)
+                            QrErrorType.ShowNotToday -> Pair(
+                                R.drawable.ic_warning,
+                                notTodayErrMessage
+                            )
+
+                            QrErrorType.UsedTicket -> Pair(
+                                R.drawable.ic_error,
+                                usedTicketErrMessage
+                            )
+
+                            QrErrorType.TicketNotFound -> Pair(
+                                R.drawable.ic_error,
+                                notMatchedErrMessage
+                            )
                         }
                     }
 
@@ -90,6 +102,7 @@ fun QrScanScreen(
     }
 
     Scaffold(
+        modifier = Modifier.navigationBarsPadding(),
         topBar = {
             BtCloseableAppBar(
                 title = uiState.showName,
@@ -172,7 +185,10 @@ private fun EntryCodeDialog(
     onDismiss: () -> Unit,
 ) {
     BTDialog(showCloseButton = false, onDismiss = onDismiss, onClickPositiveButton = onDismiss) {
-        Text(text = stringResource(R.string.manager_code), style = MaterialTheme.typography.titleLarge)
+        Text(
+            text = stringResource(R.string.manager_code),
+            style = MaterialTheme.typography.titleLarge
+        )
         Text(
             modifier = Modifier
                 .padding(top = 24.dp)