0Pricing
Kotlin Multiplatform Academy · Lesson

Navigate Between Shared Screens

Wire a navigation graph in Compose Multiplatform.

Navigate Between Shared Screens is a free Kotlin Multiplatform Academy lesson on CoddyKit — lesson 1 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Kotlin Multiplatform Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.

More Than One Screen

Real apps have many screens: a list, a detail, a settings page. Navigation is how you move between them in shared Compose code. 🧭

One Graph for Every Platform

You define a single navigation graph in commonMain, and Android, iOS and desktop all follow the same route map.

Add the Navigation Library

Compose Multiplatform ships its own navigation-compose artifact. Add it to commonMain and the routing toolkit comes with it.

commonMain.dependencies {
    implementation(libs.navigation.compose)
}

Screens Are Just Routes

Each destination is identified by a route string. Think of it like a tiny address for one screen in your app.

Create the NavController

A NavController remembers where you are and lets you move around. You create one and hand it to your graph.

val navController = rememberNavController()

Declare the NavHost

The NavHost hosts your screens and shows whichever route is current. You give it a controller and a start destination.

NavHost(navController, startDestination = "home") {
    composable("home") { HomeScreen() }
    composable("details") { DetailsScreen() }
}

Pick a Start Destination

The startDestination is the first screen users see. It is just one of your route strings, chosen as the entry point.

Navigate Forward

To open another screen you call navigate with its route. The NavHost swaps in that destination for you.

Button(onClick = { navController.navigate("details") }) {
    Text("Open details")
}

Go Back Cleanly

Calling popBackStack returns to the previous screen. Compose tracks the history so back behaves the way users expect.

navController.popBackStack()

The Back Stack

Every screen you open is pushed onto a back stack. Going back pops the top entry, just like a stack of cards.

Shared Routing, Native Hosting

The graph is shared, but each platform still hosts it in its own entry point. One route map, two native containers. 🙂

Quick Check

Which component actually performs the move from one screen to another?

Recap: A Shared Map of Screens

You added navigation, built a NavHost with routes, and used the NavController to move forward and back. One graph, every platform. 🚀

Frequently asked questions

Is the “Navigate Between Shared Screens” lesson free?

Yes — the full text of “Navigate Between Shared Screens” is free to read here on the web, and the Kotlin Multiplatform Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Kotlin Multiplatform Academy course, upgrade to CoddyKit PRO.

What will I learn in “Navigate Between Shared Screens”?

Wire a navigation graph in Compose Multiplatform. You practise Kotlin Multiplatform Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start Kotlin Multiplatform Academy?

No prior experience is required. Kotlin Multiplatform Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 1 of 4, so you can start here or from the beginning and move at your own pace.

How long does the “Navigate Between Shared Screens” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this Kotlin Multiplatform Academy lesson?

Yes. Every Kotlin Multiplatform Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

  1. Navigate Between Shared Screens
  2. Pass Arguments & Deep Links
  3. Shared Images, Fonts & Strings
  4. Localize Shared UI Text
← Back to Kotlin Multiplatform Academy