v0.2.7: Seamless Docked Bottom Navigation Bar Redesign

app/build.gradle.kts

@@ -24,8 +24,8 @@ android {
  applicationId = "com.hotdeal.alarm"
  minSdk = 31
  targetSdk = 35
-        versionCode = 26
-        versionName = "0.2.6"
+        versionCode = 27
+        versionName = "0.2.7"
 
  testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
  vectorDrawables {

app/src/main/java/com/hotdeal/alarm/presentation/main/MainScreen.kt

@@ -11,11 +11,13 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.pager.HorizontalPager
 import androidx.compose.foundation.pager.rememberPagerState
+import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.*
 import androidx.compose.material.icons.outlined.*
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
@@ -24,7 +26,6 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.core.content.ContextCompat
-import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.hotdeal.alarm.presentation.components.PermissionDialog
 import com.hotdeal.alarm.presentation.components.elasticPressClickable
 import com.hotdeal.alarm.presentation.deallist.DealListScreen
@@ -33,13 +34,12 @@ import com.hotdeal.alarm.ui.theme.CornerRadius
 import kotlinx.coroutines.launch
 
 /**
- * One UI 9 Fluid Navigation Framework
- * 한 손 조작성을 극대화한 하단 캡슐 내비게이션 바 및 화면 전환
+ * One UI 9 Docked Navigation Framework
+ * 바닥까지 완벽하게 밀착된 일체형 네이티브 하단 바
  */
 @Composable
 fun MainScreen(viewModel: MainViewModel) {
     val context = LocalContext.current
-    val uiState by viewModel.uiState.collectAsStateWithLifecycle()
 
     var showPermissionDialog by remember { mutableStateOf(false) }
     val notificationPermissionLauncher = rememberLauncherForActivityResult(
@@ -67,22 +67,23 @@ fun MainScreen(viewModel: MainViewModel) {
 
     Scaffold(
         bottomBar = {
-            // One UI 9 Fluid Bottom Navigation Bar
-            Surface(
+            // One UI 9 Docked Bottom Navigation Bar (바닥과 완벽 일체화)
+            Column(
                 modifier = Modifier
                     .fillMaxWidth()
-                    .navigationBarsPadding(),
-                color = MaterialTheme.colorScheme.surface,
-                tonalElevation = 3.dp,
-                border = androidx.compose.foundation.BorderStroke(
-                    0.8.dp,
-                    MaterialTheme.colorScheme.outlineVariant.copy(alpha = 0.25f)
-                )
+                    .background(MaterialTheme.colorScheme.surface)
             ) {
-                NavigationBar(
-                    containerColor = Color.Transparent,
-                    tonalElevation = 0.dp,
-                    modifier = Modifier.height(64.dp)
+                // 상단 초미세 헤어라인 구분선
+                HorizontalDivider(
+                    thickness = 0.6.dp,
+                    color = MaterialTheme.colorScheme.outlineVariant.copy(alpha = 0.35f)
+                )
+
+                Row(
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .height(54.dp),
+                    verticalAlignment = Alignment.CenterVertically
                 ) {
                     val navItems = listOf(
                         Triple(0, "핫딜 피드", Icons.Filled.LocalFireDepartment to Icons.Outlined.LocalFireDepartment),
@@ -93,39 +94,65 @@ fun MainScreen(viewModel: MainViewModel) {
                         val isSelected = pagerState.currentPage == pageIndex
                         val (selectedIcon, unselectedIcon) = icons
 
-                        NavigationBarItem(
-                            selected = isSelected,
-                            onClick = {
-                                coroutineScope.launch {
-                                    pagerState.animateScrollToPage(pageIndex)
+                        val itemColor = if (isSelected) {
+                            MaterialTheme.colorScheme.primary
+                        } else {
+                            MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.65f)
+                        }
+
+                        Box(
+                            modifier = Modifier
+                                .weight(1f)
+                                .fillMaxHeight()
+                                .elasticPressClickable {
+                                    coroutineScope.launch {
+                                        pagerState.animateScrollToPage(pageIndex)
+                                    }
+                                },
+                            contentAlignment = Alignment.Center
+                        ) {
+                            Column(
+                                horizontalAlignment = Alignment.CenterHorizontally,
+                                verticalArrangement = Arrangement.Center
+                            ) {
+                                // 선택 시 상단 미니 캡슐 인디케이터
+                                if (isSelected) {
+                                    Box(
+                                        modifier = Modifier
+                                            .width(20.dp)
+                                            .height(3.dp)
+                                            .clip(CornerRadius.shapePill)
+                                            .background(MaterialTheme.colorScheme.primary)
+                                    )
+                                    Spacer(modifier = Modifier.height(3.dp))
+                                } else {
+                                    Spacer(modifier = Modifier.height(6.dp))
                                 }
-                            },
-                            icon = {
+
                                 Icon(
                                     imageVector = if (isSelected) selectedIcon else unselectedIcon,
                                     contentDescription = label,
-                                    modifier = Modifier.size(24.dp)
+                                    tint = itemColor,
+                                    modifier = Modifier.size(22.dp)
                                 )
-                            },
-                            label = {
+
+                                Spacer(modifier = Modifier.height(2.dp))
+
                                 Text(
                                     text = label,
                                     style = MaterialTheme.typography.labelSmall.copy(
-                                        fontWeight = if (isSelected) FontWeight.Bold else FontWeight.Medium,
-                                        fontSize = 11.sp
-                                    )
+                                        fontSize = 11.sp,
+                                        fontWeight = if (isSelected) FontWeight.Bold else FontWeight.Medium
+                                    ),
+                                    color = itemColor
                                 )
-                            },
-                            colors = NavigationBarItemDefaults.colors(
-                                selectedIconColor = MaterialTheme.colorScheme.primary,
-                                selectedTextColor = MaterialTheme.colorScheme.primary,
-                                unselectedIconColor = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.7f),
-                                unselectedTextColor = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.7f),
-                                indicatorColor = MaterialTheme.colorScheme.primaryContainer.copy(alpha = 0.6f)
-                            )
-                        )
+                            }
+                        }
                     }
                 }
+
+                // 시스템 제스처 네비게이션 바 영역 패딩 (배경색은 일체형으로 유지)
+                Spacer(modifier = Modifier.navigationBarsPadding())
             }
         },
         contentWindowInsets = WindowInsets(0, 0, 0, 0)

version.json

@@ -1,11 +1,10 @@
 {
-  "version": "0.2.6",
-  "versionCode": 26,
-  "updateUrl": "https://git.webpluss.net/sanjeok77/hotdeal_alarm/releases/download/v0.2.6/app-release.apk",
+  "version": "0.2.7",
+  "versionCode": 27,
+  "updateUrl": "https://git.webpluss.net/sanjeok77/hotdeal_alarm/releases/download/v0.2.7/app-release.apk",
   "changelog": [
-    "상단 돋보기 클릭 시에만 검색창이 열리는 In-AppBar 온디맨드 검색 도입 (세로 시야 확보)",
-    "스크롤 시 상단바 자동 축소/숨김 (enterAlways)으로 100% 풀스크린 뷰 제공",
-    "핫딜 카드(DealItem) 덴시티 25% 슬림화로 한 화면 노출 게시글 수 대폭 증가",
-    "필터 칩 바 슬림화 및 리스트 패딩 최적화"
+    "하단 고정 메뉴 일체형(Docked) 디자인 개선 (떠 있는 이질감 완전 제거)",
+    "시스템 내비게이션 바닥까지 끊김 없는 배경 처리 및 0.6dp 헤어라인 구분선",
+    "상단 미니 캡슐 인디케이터와 One UI 9 네이티브 탭 전환 감각 적용"
   ]
 }