Chore: 바텀네이게이션 바 변경된 icon 적용

Author: wjdrjs00

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

@@ -1,6 +1,5 @@
 package com.threegap.bitnagil.navigation.home
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
@@ -9,6 +8,7 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 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.size
 import androidx.compose.material3.Text
@@ -17,13 +17,12 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.ColorFilter
-import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavController
 import androidx.navigation.compose.currentBackStackEntryAsState
 import com.threegap.bitnagil.designsystem.BitnagilTheme
+import com.threegap.bitnagil.designsystem.component.atom.BitnagilIcon
 
 @Composable
 fun HomeBottomNavigationBar(
@@ -35,14 +34,15 @@ fun HomeBottomNavigationBar(
         modifier = Modifier
             .fillMaxWidth()
             .background(color = BitnagilTheme.colors.white)
+            .height(62.dp)
             .padding(horizontal = 16.dp, vertical = 7.dp),
-        horizontalArrangement = Arrangement.spacedBy(12.dp),
+        horizontalArrangement = Arrangement.spacedBy(10.dp),
+        verticalAlignment = Alignment.CenterVertically,
     ) {
         HomeRoute.entries.map { homeRoute ->
             HomeBottomNavigationItem(
                 modifier = Modifier.weight(1f),
-                selectIconResourceId = homeRoute.selectIconResourceId,
-                unSelectIconResourceId = homeRoute.unSelectIconResourceId,
+                icon = homeRoute.icon,
                 title = homeRoute.title,
                 onClick = {
                     navController.navigate(homeRoute.route) {
@@ -58,8 +58,7 @@ fun HomeBottomNavigationBar(
 @Composable
 private fun HomeBottomNavigationItem(
     modifier: Modifier = Modifier,
-    selectIconResourceId: Int,
-    unSelectIconResourceId: Int,
+    icon: Int,
     title: String,
     onClick: () -> Unit,
     selected: Boolean,
@@ -68,25 +67,26 @@ private fun HomeBottomNavigationItem(
     val isPressed by interactionSource.collectIsPressedAsState()
 
     val contentTintColor = when {
-        isPressed -> BitnagilTheme.colors.navy300
-        selected -> BitnagilTheme.colors.navy500
-        else -> BitnagilTheme.colors.navy100
+        isPressed -> BitnagilTheme.colors.coolGray10
+        selected -> BitnagilTheme.colors.coolGray10
+        else -> BitnagilTheme.colors.coolGray90
     }
-    val iconResourceId = if (selected) selectIconResourceId else unSelectIconResourceId
 
     Column(
-        modifier = modifier.clickable(
-            onClick = onClick,
-            interactionSource = interactionSource,
-            indication = null,
-        ),
+        modifier = modifier
+            .clickable(
+                onClick = onClick,
+                interactionSource = interactionSource,
+                indication = null,
+            )
+            .padding(4.dp),
         horizontalAlignment = Alignment.CenterHorizontally,
+        verticalArrangement = Arrangement.spacedBy(4.dp),
     ) {
-        Image(
-            painter = painterResource(id = iconResourceId),
-            contentDescription = title,
-            modifier = Modifier.padding(4.dp).size(24.dp),
-            colorFilter = ColorFilter.tint(color = contentTintColor),
+        BitnagilIcon(
+            id = icon,
+            modifier = Modifier.size(24.dp),
+            tint = contentTintColor,
         )
 
         Text(
@@ -104,6 +104,5 @@ private fun HomeBottomNavigationBarPreview() {
 
     HomeBottomNavigationBar(
         navController = navigator.navController,
-
     )
 }

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

@@ -108,7 +108,7 @@ fun HomeNavHost(
                         onClick = { GlobalBitnagilToast.showWarning("제보하기 기능은 추후 제공될 예정입니다.") },
                     ),
                     FloatingActionItem(
-                        icon = R.drawable.ic_add_routine,
+                        icon = R.drawable.ic_routine_add,
                         text = "루틴 등록",
                         onClick = { navigateToRegisterRoutine(null) },
                     ),

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

@@ -5,28 +5,24 @@ import com.threegap.bitnagil.R
 enum class HomeRoute(
     val route: String,
     val title: String,
-    val selectIconResourceId: Int,
-    val unSelectIconResourceId: Int,
+    val icon: Int,
 ) {
     Home(
         route = "home/home",
         title = "홈",
-        selectIconResourceId = R.drawable.ic_home_fill,
-        unSelectIconResourceId = R.drawable.ic_home_empty,
+        icon = R.drawable.ic_home,
     ),
 
     RecommendRoutine(
         route = "home/recommend_routine",
         title = "추천 루틴",
-        selectIconResourceId = R.drawable.ic_recommend_fill,
-        unSelectIconResourceId = R.drawable.ic_recommend_empty,
+        icon = R.drawable.ic_routine_recommend,
     ),
 
     MyPage(
         route = "home/my_page",
         title = "마이페이지",
-        selectIconResourceId = R.drawable.ic_mypage_fill,
-        unSelectIconResourceId = R.drawable.ic_mypage_empty,
+        icon = R.drawable.ic_profile,
     ),
     ;
 }