0Pricing
Jetpack Compose Academy · Lesson

Composable Destinations & Routes

Register each screen as a route.

Composable Destinations & Routes is a free Jetpack Compose Academy lesson on CoddyKit — lesson 2 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 Jetpack Compose Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.

Screens as Destinations

Every screen in your graph is a destination. You register one with the composable builder inside the NavHost, naming it with a route.

composable("home") { HomeScreen() }

What a Route Really Is

A route is a unique string key for a destination. Compose matches the string you navigate to against the routes you declared.

Keep Routes in Constants

Typos in raw strings cause silent failures. Store each route as a constant so the compiler catches mistakes for you.

object Routes {
    const val HOME = "home"
    const val SETTINGS = "settings"
}

A Sealed Class of Screens

For larger apps, a sealed class groups all routes in one place. It makes adding screens safe and easy to discover.

sealed class Screen(val route: String) {
    object Home : Screen("home")
    object Settings : Screen("settings")
}

Register Each Destination

List every screen with its own composable block. The lambda body is the UI shown when that route becomes active.

NavHost(navController, startDestination = Screen.Home.route) {
    composable(Screen.Home.route) { HomeScreen() }
    composable(Screen.Settings.route) { SettingsScreen() }
}

Navigate to a Route

Use the same route string to move there. The NavController finds the matching destination and the NavHost renders it.

navController.navigate(Screen.Settings.route)

Routes Must Be Unique

Two destinations cannot share a route. Each route is an address, and duplicate addresses make navigation ambiguous and unreliable.

Pass the Controller Down

Screens often trigger navigation, so hand each destination a way to navigate. A common pattern passes lambdas instead of the whole controller.

composable("home") {
    HomeScreen(onOpenSettings = { navController.navigate("settings") })
}

Keep Screens Decoupled

Passing lambdas instead of the NavController keeps screens testable and reusable. The screen says what happened, not how to navigate.

Routes Look Like URLs

Treat routes like little URLs. This style pays off later when you add arguments and deep links that open routes from outside the app.

Group Related Flows

As graphs grow, you can split screens into nested graphs with their own routes. This keeps a feature's destinations tidy and self-contained.

Quick Check

Why prefer constants or a sealed class for routes?

Recap

You learned that each screen is a destination with a unique route, and that constants or a sealed class keep those routes safe and organized. 🗂️

Frequently asked questions

Is the “Composable Destinations & Routes” lesson free?

Yes — the full text of “Composable Destinations & Routes” is free to read here on the web, and the Jetpack Compose 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 Jetpack Compose Academy course, upgrade to CoddyKit PRO.

What will I learn in “Composable Destinations & Routes”?

Register each screen as a route. You practise Jetpack Compose 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 Jetpack Compose Academy?

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

How long does the “Composable Destinations & Routes” 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 Jetpack Compose Academy lesson?

Yes. Every Jetpack Compose 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. NavController & NavHost
  2. Composable Destinations & Routes
  3. Passing Arguments Between Screens
  4. Back Stack & Deep Links
← Back to Jetpack Compose Academy