android - Jetpack Compose 嵌套导航和 BottomAppBar

Question

我正在尝试使用 jetpack compose 导航，但在理解嵌套导航和布局脚手架时遇到了问题。
我有一个像这样的应用程序屏幕结构

root
├─ A
├─ B <- Had a bottom navigation bar
│  ├─ C
│  ├─ D

这是粗略的规范

根将在 MainActivity 中并具有 NavHost 和脚手架。

A 和 B 中的应用栏会有所不同。

B 中会有一个底部导航栏，可用于在 C 和 D 之间导航

我一直在查看文档和 StackOverflow，据我所知，最好将脚手架放在 NavHost 之外。
但是，对于我的情况，如果我无法访问 A 和 B 中的脚手架，我该如何更新 A 和 B 中的应用栏？我只能想像下面的代码一样在脚手架中进行分支

Scaffold(
    scaffoldState = scaffoldState,
    topBar = {
        when {
            currentDestination?.parent?.route == "Home" -> {
                TopAppBar(
                    title = {
                        Text("Home")
                    },
                )
            }
            currentDestination?.route == "Other screen" -> {
                 ....
            }

我还需要 A 中的访问脚手架状态。
那么解决此类问题的最佳方法是什么？

Answer 1

我遇到了 NavHost 的问题和嵌套导航多 Scaffold .
这是我的第一个解决方案:
根有自己的NavHost包含 2 个单独的页面(A 和 B)，这些页面有自己的功能。
如果我们认为页面 A 是一种类似于启动画面的单页面，我们有一个基本的 Scaffold它的组成部分。
如果我们认为页面 B 是一种像 Instagram 这样带有底部导航的多页面，我们应该在顶层创建一个 NavHost对于那个自己的页面。
这是我们的根源:

sealed class RouteScreen(val route: String) {
    object A : RouteScreen("a")
    object B : RouteScreen("b")
}

@Composable
internal fun RootNavigation(
    modifier: Modifier = Modifier,
    appState: MultiNavigationAppState
) {
    NavHost(
        navController = appState.navController,
        startDestination = RouteScreen.A.route,
        modifier = modifier
    ) {
        addA(appState)
        addB(appState)
    }
}

private fun NavGraphBuilder.addA(
    appState: MultiNavigationAppState
) {
    composable(route = RouteScreen.A.route) {
        AScreen()
    }
}

private fun NavGraphBuilder.addB(
    appState: MultiNavigationAppState
) {
    composable(route = RouteScreen.B.route) {
        BScreen(appState)
    }
}

AScreen是可组合的，您可以使用 Scaffold在里面。 BScreen与 AScreen 相同但您可以创建另一个 NavHost用于控制选项卡。

@Composable
fun BScreen(
    appState: MultiNavigationAppState
) {
    val mainState = rememberMainState()
    Scaffold(
        bottomBar = {...}
    ) {
        BNavigation(...)
    }
}

其实不建议用一个 NavHost使用嵌套导航，因为如果页面有标签和 Instagram 等功能，我们就会遇到麻烦。
第二种解决方案是我们可以使用 multi fragment有自己的 NavHost, but it's not all based on 可组合的组件。
正如您提到的，我遇到了这个问题，您可以通过 this Github project 获得更多帮助