Small Android project demonstrating some navigation components for Jetpack Compose. Created this for presenting about this topic for a GDG meetup.
The consists of simple color screens. It implements bottom tab navigation, navigating within screens, a nav drawer and a modal sort of navigation that presents over the entire app.
Simple screen that is just the color of the rgb values passed.
@Composable
fun ColorScreen(color: Color) {
Box(
modifier = Modifier
.fillMaxSize()
.background(color)
)
}
Once launched, the ParentScreen is the top most composable container. It is simply a NavHost that returns the HomeScreen as its start destination. It also passes its navController down to the HomeScreen so if needed, a composable can be presented at a root level. In this app, the Drawer (discussed later) presents the Green and Pink screen in this form.
The HomeScreen handles the presentation of the home screen that includes the bottom nav items. There are 4 bottom nav items. The black and red screens are simple ColorScreens.
The Color Choices screen presents a list of a few items that further navigate to a new ColorScreen.
The Color Maker screen allows you to create a custom RGB value and pushes a Custom Color Screen passing those values via arguments.
The Drawer contains of a Pink and Green ColorScreen. Once clicked, these are presented via the navController from the Parent screen, and thus is able to present over the Home screen.
Here is a diagram that shows the structure of the app too.
Its because instead of creating another navController for this screen, I used the homeNavController purely for experimenting with the currentBackStackEntryAsState.
Will add more explaination around the varous navHosts and navControllers. Cleanup code too.