# Compose Navigation

[Permalink](https://github.com/doctor-blue/compose-navigation/blob/2bd5b05d30e5f0ed028cd701719f31f8c080a63f/README.md)

Cannot retrieve contributors at this time

## Compose Navigation

[![](https://camo.githubusercontent.com/a4b5083376e65ccd2514257b297c272bac3dbd99bb6fabe3e71b85f9871de5fd/68747470733a2f2f6a69747061636b2e696f2f762f646f63746f722d626c75652f636f6d706f73652d6e617669676174696f6e2e737667)](https://jitpack.io/#doctor-blue/compose-navigation) [![API](https://camo.githubusercontent.com/e4be58c2eb500c8634ceff111c34f70b52db29ed45acc60eaf229098fddc801c/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4150492d32312532422d627269676874677265656e2e7376673f7374796c653d666c6174)](https://android-arsenal.com/api?level=21)

This library will make it easier to pass arguments between screens in Jetpack Compose

### Setup

```groovy
allprojects {
  repositories {
    ...
    maven { url 'https://jitpack.io' }
  }
}

dependencies {
	implementation 'com.github.doctor-blue:compose-navigation:1.1.0'
}
```

### How to use?

#### Step 1: Create your screen class and extend it with ComposeScreen class

* Example: I have 3 screens (MainScreen, Screen1, Screen2). As you can see the \_route variable is my screen name

```kotlin
mport com.devcomentry.lib.ComposeScreen

sealed class Screen(_route: String) : ComposeScreen(_route) {
    object MainScreen : Screen("main_screen")
    object Screen1 : Screen("screen1")
    object Screen2 : Screen("screen2")
}
```

#### Step 2: Create a class and implement it with Argument interface. Variables in this class is your argument you wanna pass to other screen.

* Example: I want to pass a number from MainScreen to Screen2. More variables means more arguments

```kotlin
package com.devcomentry.composenavigation.ui.screen

import com.devcomentry.lib.Argument

data class Screen2Argument(val number: Int = -1) : Argument
```

#### Step 3: Setup your navigation

* Same as using navigation component, but at the composable function you can give ComposeScreen and Argument object, let me help you with the rest.
* Support get argument from Bundle or SavedStateHandle. If Bundle or SavedStateHandle object doen't contains key argument will be default of Argument object

```kotlin
package com.devcomentry.composenavigation

import android.os.Bundle
import androidx.activity.compose.setContent
import androidx.appcompat.app.AppCompatActivity
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.rememberNavController
import com.devcomentry.composenavigation.ui.screen.*
import com.devcomentry.lib.composable
import com.devcomentry.lib.from

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            Surface {
                Surface(
                    color = MaterialTheme.colors.background,
                ) {
                    val navController = rememberNavController()
                    NavHost(
                        navController = navController,
                        startDestination = Screen.MainScreen.route
                    ) {

                        composable(Screen.MainScreen) {
                            MainScreen(navController = navController)
                        }

                        composable(Screen.Screen1) {
                            Screen1()
                        }

                        composable(Screen.Screen2, Screen2Argument()) {
                            // get data from arguments
                            it.arguments?.let {  bundle->
                                val argument = Screen2Argument().from(bundle)
                                Screen2(argument)
                            }
                        }

                    }
                }
            }
        }
    }
}
```

#### Step 4: Navigate to other screen

* Example 1: just open Screen1

```kotlin
    navController.navigate(Screen.Screen1.route)
```

* Example 2: pass random number to Screen2

```kotlin
    navController.navigate(
                        Screen.Screen2.setParam(
                            Screen2Argument(
                                Random.nextInt(
                                    0,
                                    50
                                )
                            )
                        )
                    )
```

#### Note

* You can get Argument object from arguments (Instance of Bundle) like example above.

```kotlin
    val argument = Screen2Argument().from(bundle)
    // use your argument
```

* Or get data from SavedStateHandle like this

```kotlin
    val argument = Screen2Argument().from(savedStateHandle)
    // use your argument
```

### Want more an example?

* See [Note app](https://github.com/doctor-blue/clean-architecture-jetpack-compose-note-app-android)

### Donate

[![Buy Me A Coffee](https://camo.githubusercontent.com/3ba8042b343d12b84b85d2e6563376af4150f9cd09e72428349c1656083c8b5a/68747470733a2f2f63646e2e6275796d6561636f666665652e636f6d2f627574746f6e732f64656661756c742d6f72616e67652e706e67)](https://www.buymeacoffee.com/doctorblue) [![paypal](https://camo.githubusercontent.com/361950b331ef676b7eec436a4dbe5a7ce47211a6623dcc889b1f5b7b611b27df/68747470733a2f2f7777772e70617970616c6f626a656374732e636f6d2f656e5f55532f692f62746e2f62746e5f646f6e61746543435f4c472e676966)](https://www.paypal.me/doctorblue00)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://dev-comentry.gitbook.io/docs/android/compose-navigation.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.