Developing Apps with Jetpack Compose for Android【03】 - Compose Navigation
2024, May 27
Introduction
- This is the third part of this series
Having had the opportunity to develop an entire project using Compose
After some exploration
I have some insights to share
I decided to write this process into notes to share with everyone
Initial Setup
- The libraries used are as follows:
Function
Lib
build
gradle.kts + toml
api
okhttp + retrofit2
navigation
navigation-compose
design
material 3
di
hilt
ui
jetpack compose
json
kotlinx.serialization
db
room
Implementing Navigation for Compose
- Here we plan to use a Main activity to navigate and switch to other screens
So today we will implement NavHost in Compose
step1. Create enums for each screen
- First, define an enum
It will contain the content you expect to navigate to
It can be expanded gradually as needed
step2. Define Compose Screen
- Implement the screens you need, for example:
step3. Create routers for each screen
- Since we will use NavGraphBuilder
Extend NavGraphBuilder to specify the router for each screen
Here, we use the previously definedLogin
as a reference indicator for its router
To navigate to the LoginScreen, add the screen in the lambda
step4. Register each screen
- Next, add all the screens you want to navigate to in the
NavHost
startDestination
: your starting screen
navController
: used to specify the navigation controller
To switch screens, simply control it with navController
For example:navController.navigate(ElegantAccessScreen.Feedback.name)
step5. Achieve multiple screens in one activity
- Finally, when you want to add a new screen
Simply implement the Screen
Practical use: