Guia Navigation
Github
  • Overview
  • Setup
  • Using Guia
    • 📔Express Lore
      • Quick Start
    • 📖The Lore
      • Navigation Key
      • Navigation Node
        • Screen
        • Bottom Sheet
        • Dialog
      • Navigator
        • Navigation Operations
        • Navigator Instance
        • Back Handling
      • Navigator Config
        • Dynamic Navigation Node
        • Transitions
      • Containers
      • NavHost
        • Back Handling
      • Multi module navigation
        • NavHost Multi module
      • Deep Linking / Global Navigation
      • Results
      • Lifecycle, ViewModel, Saved State
      • UI Tests
  • 🤖Advanced
    • Custom LifecycleManager
Powered by GitBook
On this page
  1. Using Guia
  2. Express Lore

Quick Start

PreviousExpress LoreNextThe Lore

Last updated 2 years ago

First, let's declare some destinations, in Guia, they are called a

@Parcelize
class HomeKey: NavigationKey

@Parcelize
class ProfileKey(val profileId: String): NavigationKey

Then we declare a :

val navigator = rememberNavigator(initialKey = HomeKey()) // Initial Key is optional

To link a to a Composable we can use the builder parameter in rememberNavigator:

val navigator = rememberNavigator(initialKey = HomeKey()) {
    screen<HomeKey> { HomeScreen() }
    bottomSheet<ProfileKey> { key -> ProfileScreen(profileId = key.profileId) }
    dialog<DialogKey> { DialogScreen() }
}

Alternatively, a key can host its own Composable, called a , then we don't need to declare it in our builder, the builder is convenient in

class DetailsBottomSheetKey(
    val item: String
) : NavigationKey.WithNode<BottomSheet> {

    override fun navigationNode() = BottomSheet {
        Text(text = "Item: $item")
    }
}

To get the instance of our navigator and do some navigation:

@Composable
fun HomeScreen() {
    val navigator = requireLocalNavigator()
    
    // On Button click or some other event
    navigator.push(ProfileKey("some_id"))
    
    // We can also go back by calling pop
    navigator.pop()
}

Finally we render the navigator's state:

navigator.NavContainer()

(For a list of all default operations provided by Guia check )

We can also add some , type-safe , behaviour and more. Check for more comprehensive usage of Guia.

📔
NavigationKey
Navigator
NavigationKey
NavigationNode
Multi Module projects
Navigation Operations
Transitions
Results
bottom-nav
The Lore