- 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