From 0fea2ab46fb82fc8fc99c155e7ce4cd12b3dcb6b Mon Sep 17 00:00:00 2001
From: DwEnn <prgohn@gmail.com>
Date: Fri, 15 Sep 2023 22:06:43 +0900
Subject: [PATCH] =?UTF-8?q?=EB=B0=94=ED=85=80=EB=B0=94=20=EB=94=94?=
 =?UTF-8?q?=EC=9E=90=EC=9D=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../main/java/com/keyme/app/ui/KeymeApp.kt    | 40 +++++++++++--------
 .../com/keyme/presentation/utils/Modifiers.kt | 18 +++++++++
 2 files changed, 42 insertions(+), 16 deletions(-)

diff --git a/app/src/main/java/com/keyme/app/ui/KeymeApp.kt b/app/src/main/java/com/keyme/app/ui/KeymeApp.kt
index 3246a7e..af928a4 100644
--- a/app/src/main/java/com/keyme/app/ui/KeymeApp.kt
+++ b/app/src/main/java/com/keyme/app/ui/KeymeApp.kt
@@ -1,14 +1,17 @@
 package com.keyme.app.ui
 
-import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Icon
 import androidx.compose.material3.NavigationBar
-import androidx.compose.material3.NavigationBarItem
-import androidx.compose.material3.NavigationBarItemDefaults
 import androidx.compose.material3.Scaffold
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
@@ -26,6 +29,7 @@ import com.keyme.presentation.myprofile.ui.myProfileGraph
 import com.keyme.presentation.onboarding.onboardingGraph
 import com.keyme.presentation.takekeymetest.TakeKeymeTestDestination
 import com.keyme.presentation.takekeymetest.takeKeymeTestGraph
+import com.keyme.presentation.utils.topBorder
 
 @Composable
 fun KeymeApp() {
@@ -102,25 +106,29 @@ fun KeymeBottomBar(
     onNavigateToDestination: (TopLevelDestination) -> Unit,
 ) {
     NavigationBar(
-        modifier = Modifier.border(width = 1.dp, color = Color(0xFF363636)),
+        modifier = Modifier.topBorder(width = 1.dp, color = Color(0xFF363636)),
         containerColor = Color(0x80232323),
         tonalElevation = 4.dp,
     ) {
         keymeTopLevelDestinations.forEach { destination ->
             val isSelected = currentDestination?.hierarchy?.any { it.route == destination.route } == true
 
-            NavigationBarItem(
-                selected = isSelected,
-                onClick = {
-                    onNavigateToDestination(destination)
-                },
-                icon = {
-                    val iconResId =
-                        if (isSelected) destination.selectedIconResId else destination.unselectedIconResId
-                    Icon(painter = painterResource(id = iconResId), contentDescription = "")
-                },
-                colors = NavigationBarItemDefaults.colors(indicatorColor = Color.Transparent),
-            )
+            val iconResId =
+                if (isSelected) destination.selectedIconResId else destination.unselectedIconResId
+            Box(
+                modifier = Modifier
+                    .align(Alignment.CenterVertically)
+                    .fillMaxHeight()
+                    .weight(1f)
+                    .clickable(
+                        interactionSource = remember { MutableInteractionSource() },
+                        indication = null,
+                        onClick = { onNavigateToDestination(destination) },
+                    ),
+                contentAlignment = Alignment.Center,
+            ) {
+                Icon(painter = painterResource(id = iconResId), contentDescription = "")
+            }
         }
     }
 }
diff --git a/presentation/src/main/java/com/keyme/presentation/utils/Modifiers.kt b/presentation/src/main/java/com/keyme/presentation/utils/Modifiers.kt
index 7d00e7a..4a56b60 100644
--- a/presentation/src/main/java/com/keyme/presentation/utils/Modifiers.kt
+++ b/presentation/src/main/java/com/keyme/presentation/utils/Modifiers.kt
@@ -6,6 +6,10 @@ import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.composed
+import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.Dp
 
 fun Modifier.clickableRippleEffect(bounded: Boolean = true, onClick: () -> Unit) = composed {
     clickable(
@@ -14,3 +18,17 @@ fun Modifier.clickableRippleEffect(bounded: Boolean = true, onClick: () -> Unit)
         onClick = { onClick() },
     )
 }
+
+fun Modifier.topBorder(width: Dp, color: Color) = composed {
+    drawBehind {
+        val strokeWidth = width.value * density
+        val y = strokeWidth / 2
+
+        drawLine(
+            color,
+            Offset(0f, y),
+            Offset(size.width, y),
+            strokeWidth,
+        )
+    }
+}