在按钮上浏览底部navbar -jetpack组成

Question

我的底部navigationbar有4个项目，当用户单击按钮时，我想导航到最后一个项目。

这是我的底部努力栏：

@Composable
fun BottomNavigationBar(navController: NavController) {
    val items = listOf(
        BottomNavigationItem.Home,
        BottomNavigationItem.Explore,
        BottomNavigationItem.Favorites,
        BottomNavigationItem.Profile
    )

    val navBackStackEntry by navController.currentBackStackEntryAsState()
    val currentRoute = navBackStackEntry?.destination?.route

    BottomNavigation(
        backgroundColor = colorResource(id = R.color.purple_700),
        contentColor = Color.White
    ) {

        Row(horizontalArrangement = Arrangement.Center) {
 
            items.forEachIndexed { i, item ->
                if (i == items.count() / 2) {
                    Spacer(Modifier.weight(1f))
                }
                BottomNavigationItem(
                    icon = {
                        if (currentRoute == item.route) {
                            Icon(painterResource(id = item.iconPressed), contentDescription = item.title)
                        } else {
                            Icon(painterResource(id = item.iconNormal), contentDescription = item.title)
                        }
                    },
                    selectedContentColor = Color.White,
                    unselectedContentColor = Color.White,
                    alwaysShowLabel = false,
                    selected = currentRoute == item.route,
                    onClick = { 
                        navController.navigate(item.route) { 
                            navController.graph.startDestinationRoute?.let { route -> 
                                popUpTo(route) { 
                                    saveState = true
                                }
                            } 
                            launchSingleTop = true
                             restoreState = true
                        }
                    }
                )
            }

        }
    }
}

这是我尝试导航到“配置文件”屏幕时的方式（在我的Mainactivity navgraph中）：

     composable(BottomNavigationItem.Favorites.route) {
         
        FavoriteScreen(navigateToProfile = {
            navController.navigate(BottomNavigationItem.Profile.route) {
                        popUpTo(navController.graph.findStartDestination().id) {
                            saveState = true
                        }
                        launchSingleTop = true
                        restoreState = true
                    }
        })
    }                       

不幸的是，这给了我一个奇怪的行为，即我的底部navigationbar无法正常工作，主要是第一个。屏幕不再打开了。

某些东西混杂在一起，“ HomeScreen”底部navitem在远程导航后导航到“ profilescreen”。

远程导航的正确方法是什么？

Answer 1

经过几个小时的苦苦挣扎，我自己最终创建了a bug Report a href =“ https://github.com/scottschmitz/sample_compose_nav” rel =“ nofollow noreferrer”>示例项目证明了此问题。它被标记为重复，而不是错误。

如果要模拟交换到另一个选项卡，请确保使用与底部NAV所用的完全相同的标志来实际从与另一个选项卡关联的后堆栈关联到与另一个选项卡关联的后堆栈相关联的后堆栈。

。

因此，从那时起，我决定要做的是扩展navHostController，并且只始终从我的bottom> bottom> bottomnavigationitem.onclick的内部调用switchtabs。我想导致选项卡开关的任何按钮。

fun NavHostController.switchTabs(route: String) {
  navigate(route) {
    // Pop up to the start destination of the graph to
    // avoid building up a large stack of destinations
    // on the back stack as users select items
    popUpTo(graph.findStartDestination().id) {
      saveState = true
    }
    
    // Avoid multiple copies of the same destination when
    // reselecting the same item
    launchSingleTop = true

    // Restore state when reselecting a previously selected item
    restoreState = true
  }
}

对我来说，这导致了更加理智的导航结构，并删除了我的所有问题，这些问题在底部磁头上似乎没有反应。