'Is there any way of putting two navigation graphs into separate scaffolds in Jetpack Compose?

I am trying to build a multi-step onboarding for my Android app using Jetpack Compose and its navigation module.

My setup of choice would be to have two separate navigation graphs. One for the onboarding and another one for the main experience. The onboarding needs a scaffold with a top bar and the main experience has a tab bar.

Is there any way of putting each navigation graph into its own Scaffold while preserving to only have one NavHost?

I have tried that but I am not able to do something like that:

NavHost(navController = navController, Destinations.Onboarding.welcome) {
    navigation(Destinations.Onboarding.welcome, Destinations.Onboarding.graph) {
         Scaffold(...)
         // all of the composable(route = "something") should go inside of the scaffold
    }
    navigation(Destinations.Main.dashboard, Destinations.Main.graph) {
         Scaffold(...)
         // all of the composable(route = "something") should go inside of the scaffold
    }
}

Is there any way of achieving what I want or do you have any tips on how to build such a setup?

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'Is there any way of putting two navigation graphs into separate scaffolds in Jetpack Compose?

Sources

Related Questions