导航托普巴尔带有底部轨道

Question

我在Topappbar中显示“返回”按钮有问题。 我有家庭的底漆和最喜欢的自行车。 当我想显示自行车的详细信息时，我想让箭头回去。

BottomNavgraph：

NavHost(
    navController =navController,
    startDestination = Screen.Home.route
){
    composable(route = Screen.Home.route){
        HomeScreen(navController = navController)
    }
    composable(route = Screen.Favorite.route){
        FavoriteScreen(navController = navController)
    }
    composable(route = Screen.Details.route){
        val bike = navController.previousBackStackEntry?.savedStateHandle?.get<Bike>("bike")

        bike?.let{
            BikeDetaliScreen(navController = navController, movie)
        }

    }

和Topappbar：

if(navController.previousBackStackEntry != null){
        TopAppBar(
            title = {
                Box(modifier = Modifier.fillMaxWidth()
                ) {
                    Image(
                        painterResource(
                            id = R.drawable.bike_logo
                        ),
                        "Logo picture",
                        modifier = Modifier
                            .size(130.dp)
                            .align(Alignment.Center)
                    )
                }
            },
            backgroundColor = Color(0xFF0B253F)
        )
    }

问题是我只想在详细信息屏幕上，而不是在家中或喜欢的屏幕上。但是，当我使用以前的backstackentry！= null Somethimes最喜欢的屏幕上有箭头，因为它在堆栈中有房屋屏幕。

Answer 1

您可以观察当前的后堆栈条目，并相应地显示/隐藏“后背”按钮。

// When you navigate to another screen, this value is updated.
val currentRoute = navController
    .currentBackStackEntryFlow
    .collectAsState(initial = navController.currentBackStackEntry)

val showBackButton = when (currentRoute.value?.destination?.route) {
    Screen.Home.route -> false
    else -> true
}

TopAppBar(
    ...
    navigationIcon = {
        if (showBackButton) {
            IconButton(
                onClick = { ... }
            ) { Icon(Icons.Default.ArrowBack, "Back") }
        }
    }
)