• Developer's Commute
  • Posts
  • Quick Question: Do you know how to use Navigation in Jetpack Compose - Developer's Commute

Quick Question: Do you know how to use Navigation in Jetpack Compose - Developer's Commute

Quick Question: Do you know how to use Navigation in Jetpack Compose - Developer's Commute

Android Interview Questions

Android Developer Aye?

Here is everything you need to know about Navigation in compose

Navigation Compose provides an API that helps us to navigate using Jetpack Compose.

Features:

Handles up and back Navigation Deep Links

Three parts of the Navigation Component:

  • Nav controller

  • NavHost

  • Navigation Graph

What is a Nav Controller?

  • The navigation component works because of the Nav Controller.

  • It is used to navigate between different destinations.

  • Nav Controller maintains the state of the destination and back stack

  • The instance of the nav controller is given by remembernavController()

Nav Controller can be easily remembered from its name

Navigation Controller means the one who controls the navigation

What is NavHost?

  • NavHost acts as a host of the navigation system.

  • It connects our nav controller and nav graph

  • It requires an instance of the nav controller and start destination.

It can be easily remembered from its name Navigation host is the one who hosts the navigation and connects the controller to the graph

What is a Nav Graph?

  • Nav Graph handles all the navigation screens.

  • Nav Graph does this by using the lambda syntax from navigation Kotlin DSL

  • Nav host requires a nav controller and start destination which has a nav graph builder

  • NavgraphBuilder. composable method is used for navigation

  • Composable requires a route String

  • The screen is passed to composable using lambda syntax

Using the Navigate Method of NavController

  • After setting up the navigation, we use the navigate method to navigate between destinations.

  • Since Navigate is part of the Nav Controller, it is tempting to pass the Nav Controller to the composable

  • But it is not good practice

  • Instead, we pass a simple onClick function in the composable

  • And call the Navigate function in NavHost

  • That is the better way to do it

What are Navigation Arguments?

  • When passing specific details inside the composable we use navigation arguments.

  • For example, if we want to pass a meal ID inside the composable in order to show details for that meal.

  • We can give meal ID in arguments

  • And retrieve it using a backstack entry

  • Passing it onto the screen which shows details of the meal.

What are Deep Links?

→ Deep links allow us to open our apps from websites or other apps

→ In order to open apps from the website we use URIs which are similar to website URLs

→ URIs are Stream of characters that take us someplace

→ URI is Uniform Resource Identifier → URI can be broken down into the following form

Some best practices that we need to follow while writing navigation code:

→ Navigation code has a lot of Strings so it is best to store them in const formats

→ Then use them inside the code

Drawbacks of Navigation:

→ No navigation Editor

→ Repetitive and tricky concatenation way to build routes

→ Lack of argument-type safety while passing them into navigation components

Alternatives:

→ Third part alternatives ⇒ Compose Destinations, Voyager

Android Manifest File

→ The intent filter defines: → Data→ From where our app should be opened → Default → If we do not have any specific activity mentioned it just opens the default one

→ Browsable → The app can be opened from a browser → Action view → It tells us that we just want to view that content

Coding Meme