Feat: edge-to-edge 적용 및 시스템 바 패딩 추가

Author: wjdrjs00

app/src/main/java/com/threegap/bitnagil/MainActivity.kt

@@ -2,6 +2,7 @@ package com.threegap.bitnagil
 
 import android.os.Bundle
 import androidx.activity.ComponentActivity
+import androidx.activity.SystemBarStyle
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
 import com.threegap.bitnagil.designsystem.BitnagilTheme
@@ -11,7 +12,12 @@ import dagger.hilt.android.AndroidEntryPoint
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
-        enableEdgeToEdge()
+        enableEdgeToEdge(
+            statusBarStyle = SystemBarStyle.light(
+                scrim = android.graphics.Color.TRANSPARENT,
+                darkScrim = android.graphics.Color.TRANSPARENT,
+            ),
+        )
         setContent {
             val mainNavigator = rememberMainNavigator()
             BitnagilTheme {

app/src/main/java/com/threegap/bitnagil/MainScreen.kt

@@ -1,10 +1,13 @@
 package com.threegap.bitnagil
 
+import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.navigationBars
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Scaffold
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import com.threegap.bitnagil.designsystem.BitnagilTheme
 
 @Composable
 fun MainScreen(
@@ -13,6 +16,8 @@ fun MainScreen(
 ) {
     Scaffold(
         modifier = modifier.fillMaxSize(),
+        contentWindowInsets = WindowInsets.navigationBars,
+        containerColor = BitnagilTheme.colors.white,
     ) { innerPadding ->
         MainNavHost(
             navigator = navigator,

app/src/main/java/com/threegap/bitnagil/navigation/home/HomeNavHost.kt

@@ -46,7 +46,7 @@ fun HomeNavHost(
 
     DoubleBackButtonPressedHandler()
 
-    Box(modifier = Modifier.fillMaxSize()) {
+    Box(modifier = modifier.fillMaxSize()) {
         Scaffold(
             modifier = Modifier.fillMaxSize(),
             bottomBar = {

core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/component/block/BitnagilProgressTopBar.kt

@@ -5,6 +5,7 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -24,6 +25,7 @@ fun BitnagilProgressTopBar(
     Row(
         modifier = modifier
             .fillMaxWidth()
+            .systemBarsPadding()
             .height(54.dp)
             .padding(start = 4.dp, end = 18.dp),
         verticalAlignment = Alignment.CenterVertically,

core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/component/block/BitnagilTopBar.kt

@@ -7,6 +7,7 @@ import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -30,6 +31,7 @@ fun BitnagilTopBar(
     Box(
         modifier = modifier
             .fillMaxWidth()
+            .systemBarsPadding()
             .height(54.dp),
     ) {
         if (showBackButton) {

presentation/src/main/java/com/threegap/bitnagil/presentation/intro/IntroScreen.kt

@@ -9,6 +9,7 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -60,7 +61,8 @@ private fun IntroScreen(
         horizontalAlignment = Alignment.CenterHorizontally,
         modifier = modifier
             .fillMaxSize()
-            .background(BitnagilTheme.colors.white),
+            .background(BitnagilTheme.colors.white)
+            .systemBarsPadding(),
     ) {
         Spacer(modifier = Modifier.height(screenHeight * 0.0748f))
 

presentation/src/main/java/com/threegap/bitnagil/presentation/login/LoginScreen.kt

@@ -2,7 +2,6 @@ package com.threegap.bitnagil.presentation.login
 
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
-import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -12,6 +11,7 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -29,6 +29,7 @@ import androidx.hilt.navigation.compose.hiltViewModel
 import com.threegap.bitnagil.designsystem.BitnagilTheme
 import com.threegap.bitnagil.designsystem.R
 import com.threegap.bitnagil.designsystem.component.atom.BitnagilIcon
+import com.threegap.bitnagil.designsystem.modifier.clickableWithoutRipple
 import com.threegap.bitnagil.presentation.login.kakao.KakaoLoginHandlerImpl
 import com.threegap.bitnagil.presentation.login.model.LoginSideEffect
 import org.orbitmvi.orbit.compose.collectSideEffect
@@ -82,7 +83,8 @@ private fun LoginScreen(
         horizontalAlignment = Alignment.CenterHorizontally,
         modifier = modifier
             .fillMaxSize()
-            .background(BitnagilTheme.colors.white),
+            .background(BitnagilTheme.colors.white)
+            .systemBarsPadding(),
     ) {
         Spacer(modifier = Modifier.height(screenHeight * 0.0748f))
 
@@ -111,7 +113,7 @@ private fun LoginScreen(
             modifier = Modifier
                 .padding(start = 16.dp, end = 16.dp, bottom = 20.dp)
                 .height(54.dp)
-                .clickable { onKakaoLoginClick() }
+                .clickableWithoutRipple { onKakaoLoginClick() }
                 .background(
                     color = BitnagilTheme.colors.kakao,
                     shape = RoundedCornerShape(12.dp),
@@ -122,7 +124,7 @@ private fun LoginScreen(
         ) {
             BitnagilIcon(
                 id = R.drawable.ic_kakao_login,
-                modifier = Modifier.padding(end = 8.dp)
+                modifier = Modifier.padding(end = 8.dp),
             )
             Text(
                 text = "카카오로 시작하기",