Jetpack Compose底部应用栏嵌套导航与全屏页面跳转实现咨询

核心逻辑是按页面属性划分路由类型，通过控制底部导航栏的显隐实现需求，具体实现步骤如下：

• 第一步先定义全页面路由常量，把页面分为「全屏独立页面」和「首页Tab子页面」两类：

sealed class AppRoute(val path: String) {
    // 全屏独立页面
    object Login : AppRoute("login")
    object Register : AppRoute("register")
    object Settings : AppRoute("settings")
    // 首页底部导航对应的Tab页面
    object HomeTab : AppRoute("home")
    object ExploreTab : AppRoute("explore")
    object MineTab : AppRoute("mine")
}

• 第二步监听当前导航栈的顶层路由，动态控制底部导航的显隐：只有当前路由属于首页Tab类时，才显示底部导航，其余场景全部隐藏。可以通过currentBackStackEntryAsState监听路由变化：

@Composable
fun AppMainNav(navController: NavHostController = rememberNavController()) {
    // 监听当前路由
    val currentBackStack by navController.currentBackStackEntryAsState()
    val currentRoute = currentBackStack?.destination?.route
    // 仅首页Tab显示底部导航
    val showBottomBar = currentRoute in listOf(
        AppRoute.HomeTab.path, 
        AppRoute.ExploreTab.path, 
        AppRoute.MineTab.path
    )

    Scaffold(
        bottomBar = { 
            if (showBottomBar) {
                BottomNavigationBar(navController = navController)
            }
        }
    ) { innerPadding ->
        NavHost(
            navController = navController,
            startDestination = AppRoute.Login.path,
            modifier = Modifier.padding(innerPadding)
        ) {
            // 注册全屏独立页面
            composable(AppRoute.Login.path) {
                LoginScreen(onLoginSuccess = {
                    // 登录成功跳转到首页，清空登录页的回退栈
                    navController.navigate(AppRoute.HomeTab.path) {
                        popUpTo(AppRoute.Login.path) { inclusive = true }
                    }
                })
            }
            composable(AppRoute.Register.path) { RegisterScreen(navController) }
            composable(AppRoute.Settings.path) { SettingsScreen(navController) }
            
            // 注册首页Tab页面
            composable(AppRoute.HomeTab.path) { HomeScreen(navController) }
            composable(AppRoute.ExploreTab.path) { ExploreScreen(navController) }
            composable(AppRoute.MineTab.path) { MineScreen(
                onJumpToSettings = {
                    // 跳转到设置页，底部导航会自动隐藏
                    navController.navigate(AppRoute.Settings.path)
                }
            ) }
        }
    }
}

• 如果首页Tab内部还有子页面需要隐藏底部导航，只需要把对应路由添加到showBottomBar的排除列表即可。如果需要更清晰的路由分层，也可以用嵌套导航实现，逻辑和上述方案一致，监听嵌套导航的当前路由控制底部导航显隐即可。

内容的提问来源于stack exchange，提问作者Ankit Shah