I have an issue with navigating to a separate scre...

# compose

[Samuel G]

I have an issue with navigating to a separate screen from an activity that is inside a scaffold body.
Here is the MainScreen:

@Composable
fun MainScreen() {
    val navController = rememberNavController()

    Scaffold(
        topBar = {
            TopAppBar()
        },
        bottomBar = {
            BottomAppBar(navController)
        },
    ) { innerPadding ->
        NavHostContainer(navController = navController, padding = innerPadding)
    }
}

The NavHostContainer looks like this:

@Composable
fun NavHostContainer(
    navController: NavHostController,
    padding: PaddingValues
) {
    NavHost(
        navController = navController,
        startDestination = "tasklist",
        modifier = Modifier.padding(paddingValues = padding),
        builder = {
            // route : task list screen
            composable("tasklist") {
                TaskListScreen(navController = navController)
            }

            // route : detail screen
            composable("detail") {
                TaskDetailScreen()
            }

            // route : calendar screen
            composable("calendar") {
                CalendarScreen()
            }

            // route : archive screen
            composable("archive") {
                ArchiveScreen()
            }
        }
    )
}

I have a list of items inside the TaskListScreen and I want to navigate to a separate screen when clicking on an item inside that list. But right now it'll just spawn the new screen inside the body of the scaffold. Does anyone have an idea on how to do that?

[Samuel G]

Ok I found something that solved my problem.
https://stackoverflow.com/a/78598272