点击按钮导航底部导航栏-Jetpack Compose

snz8szmq  于 2022-09-21  发布在  Android
关注(0)|答案(1)|浏览(225)

我的BottomNavigationBar有4个项目,我想在用户单击按钮时导航到最后一个项目。

这是我的BottomNavigationBar:

@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导航图中)时,我尝试导航到“配置文件”屏幕的方法:

composable(BottomNavigationItem.Favorites.route) {

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

不幸的是,这给了我一个奇怪的行为,我的BottomNavigationBar不能正常工作,大多数情况下第一个屏幕不再打开。

有些事情搞混了,远程导航后,“主屏幕”底部的NavItem导航到“ProfileScreen”。

远程导航BottomNavigationBar的正确方式是什么?

c90pui9n

c90pui9n1#

经过几个小时的努力,我想明白我到底做错了什么,现在我想出了一个可能的解决方案。如果您的BottomNavigationItem有一个复杂的图表与之关联,我不确定这是否是一种可持续的方法,但对于我在onClick中将其标记为restoreState = false的用例,我修复了这个问题。

onClick = { 
  navController.navigate(item.route) { 
    navController.graph.startDestinationRoute?.let { route -> 
      popUpTo(navController.graph.findStartDestination().id) { 
        saveState = true
      }
    } 
    launchSingleTop = true
    restoreState = false
  }
}

相关问题