BottomBar doesnt get hide when the route is changed with Jetpack Compose Navigation

Question

I'am learning Jetpack Compose and MyBottomBar doesn't get hide when i changed the route.

Here is my code for scaffold layout :

Scaffold(
    topBar = {
        TopAppBar(
            title = {
                Text(text = "LeleNime", color = Color.White)
            }, backgroundColor = backgroundColor
        )
    },
    modifier = modifier,
    bottomBar = {
        if (currentRoute != AnimeScreen.DetailAnime.route) {
            AnimeBottomBar(navController = navController, backgroundColor = backgroundColor)
        }
    },
    scaffoldState = scaffoldState
) { paddingValues ->
    NavHost(
        navController = navController,
        startDestination = AnimeScreen.Dashboard.route,
        modifier = modifier.padding(paddingValues)
    ) {
        composable(AnimeScreen.Dashboard.route) {
            DashboardScreen(onClicked = { animeId ->
                navController.navigate(AnimeScreen.DetailAnime.createRoute(animeId))
            })
        }
        composable(AnimeScreen.Explore.route) {
            ExploreAnimeScreen()
        }
        composable(AnimeScreen.MyList.route) {
            MyListScreen()
        }
        composable(
            route = AnimeScreen.DetailAnime.route,
            arguments = listOf(navArgument("animeId") {
                type = NavType.IntType
            })
        ) {
            val id = it.arguments?.getInt("animeId") ?: 0
            DetailAnimeScreen(id)
        }
    }
}

And here is my code for the screen route :

sealed class AnimeScreen(val route: String) {
object Dashboard : AnimeScreen("dashboard")
object MyList: AnimeScreen("myList")
object Explore: AnimeScreen("explore")
object DetailAnime: AnimeScreen("detail/{animeId}") {
    fun createRoute(animeId: Int) = "detail/$animeId"
  }
}

as my code above,i did the If Else logic to check the route, but it didn't work on me. Is this a bug or is there something that i missed?

Answer 1

Because you are sending arguments in this specific route it is not the same string exactly, you can do something like this with the contains() function:

 if(currentRoute?.contains(AnimeScreen.DetailAnime.route.substringBefore("/")) == false){
        //show bottom bar
 }

You can do it in more elegant ways, like with constants but it should work