compose-navigation

Model Jetpack Compose navigation routes as @Serializable primitives for type-safe NavHost setup.

Updated Nov 3, 2025
One-click install
npx skills add https://github.com/devanfer02/telnetquiz --skill compose-navigation-devanfer02
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: compose-navigation
Source: https://github.com/devanfer02/telnetquiz/tree/main/.claude/skills/compose-navigation
Command: npx skills add https://github.com/devanfer02/telnetquiz --skill compose-navigation-devanfer02

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Building scalable, type-safe navigation in Jetpack Compose apps by modeling routes as serializable primitives to avoid fragile string-based routing and runtime errors.

Core Features & Use Cases

  • Type-safe routes: Use @Serializable to define screen routes (e.g., Home, Profile, Settings) to ensure compile-time safety.
  • NavHost & argument passing: Setup NavHost, navigate with arguments, and read them in composables or ViewModels.
  • Deep links & nested graphs: Support deep links and nested navigation graphs for complex flows; adapt to screen sizes with adaptive navigation.
  • Testing & patterns: Extract NavHost for testability and apply best practices for bottom navigation and state restoration.
  • Use Case: Create a two-screen flow (Home -> Profile) with a required userId argument and verify navigation state in tests.

Quick Start

Create a simple app with a Home screen and a Profile screen. Navigate from Home to Profile using a serializable route.

Frequently Asked Questions about compose-navigation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement type-safe navigation in Jetpack Compose?

Type-safe navigation in Jetpack Compose is implemented by modeling routes as serializable primitives using @Serializable, replacing fragile string-based routing to ensure compile-time safety and prevent runtime errors.

How do I pass arguments between screens using navigation-compose?

Pass arguments in navigation-compose by defining them in serializable route classes, then read them inside composables or ViewModels using patterns like SavedStateHandle.toRoute<T>() for safe state transfer.

Does Jetpack Compose navigation support deep links and nested graphs?

Jetpack Compose navigation supports deep links and nested navigation graphs, enabling complex screen flows and adaptive navigation across different screen sizes within a single NavHost setup.

What is the best way to test Jetpack Compose navigation flows?

The best way to test Jetpack Compose navigation flows is to extract the NavHost into a separate composable, allowing you to verify navigation state and argument passing across multiple screen flows in isolation.

Why should I use @Serializable routes instead of string-based routing in Android Kotlin?

You should use @Serializable routes instead of string-based routing in Android Kotlin to avoid runtime crashes from typos, ensuring compile-time validation of navigation paths, arguments, and deep links.

Can I restore navigation state with bottom navigation in Compose?

Yes, you can restore navigation state with bottom navigation in Compose by applying established navigation patterns that preserve state across tab switches and handle required arguments correctly.