compose-navigation

Implement type-safe navigation in Jetpack Compose with Navigation Compose.

10.4k|519|Updated Apr 15, 2023
One-click install
npx skills add https://github.com/maxrave-dev/SimpMusic --skill compose-navigation-maxrave-dev
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: compose-navigation
Source: https://github.com/maxrave-dev/SimpMusic/tree/main/.claude/skills/compose-navigation
Command: npx skills add https://github.com/maxrave-dev/SimpMusic --skill compose-navigation-maxrave-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires androidx.navigation:navigation-compose, org.jetbrains.kotlinx:kotlinx-serialization-json, and includes references (resource) components.

What problem does it solve?

This Skill simplifies the process of implementing navigation within Jetpack Compose applications, ensuring type-safe navigation and efficient data passing between screens.

Core Features & Use Cases

  • NavHost Setup: Configure the core navigation graph for your Compose app.
  • Type-Safe Routes: Define navigation destinations using serializable data classes for compile-time safety.
  • Argument Passing: Pass data between screens, including complex objects via IDs and optional parameters.
  • Deep Linking: Handle incoming deep links to navigate directly to specific app destinations.
  • Nested Navigation: Structure complex navigation flows using nested navigation graphs.
  • Adaptive Layouts: Implement responsive navigation patterns suitable for different screen sizes.
  • Testing: Write robust tests for your navigation logic.
  • Use Case: Set up a multi-screen e-commerce app where users can browse products, view details, add to cart, and checkout, with seamless transitions and data persistence.

Quick Start

Add the navigation-compose dependency to your build.gradle.kts file.

Frequently Asked Questions about compose-navigation

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

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

Type-safe navigation in Jetpack Compose requires the navigation-compose library and kotlinx.serialization to define routes using serializable data classes. This configuration enables compile-time safety for your NavHost setup and entire navigation graph.

What is the best way to pass complex arguments between Compose screens?

Passing complex arguments between Compose screens is best handled by transferring object IDs and optional parameters rather than full objects. This approach maintains type-safe routes and ensures efficient data passing within your navigation graph.

Does Jetpack Compose navigation support deep links and nested graphs?

Jetpack Compose navigation supports handling incoming deep links to direct users to specific app destinations. You can also structure complex flows by organizing these destinations into nested navigation graphs.

Can I implement adaptive navigation layouts for different screen sizes in Compose?

You can implement adaptive navigation layouts in Compose to create responsive patterns suitable for different screen sizes. This allows your NavHost and routing structure to dynamically adapt to various device displays.

How do I test navigation logic in an Android Jetpack Compose application?

Testing navigation logic in a Jetpack Compose application involves writing robust tests that verify NavHost transitions and argument passing. This ensures your routing configuration and type-safe destinations function correctly under various conditions.