Navigation in a Compose-only app uses NavHost instead of an XML nav graph:

@Composable
fun AppNavHost(navController: NavHostController) {
    NavHost(navController = navController, startDestination = "movieList") {
        composable("movieList") {
            MovieListScreen(onMovieClick = { id -> navController.navigate("movieDetail/$id") })
        }
        composable(
            "movieDetail/{movieId}",
            arguments = listOf(navArgument("movieId") { type = NavType.IntType })
        ) { backStackEntry ->
            val movieId = backStackEntry.arguments?.getInt("movieId") ?: return@composable
            MovieDetailScreen(movieId = movieId)
        }
    }
}

Material 3 theming

@Composable
fun AppTheme(content: @Composable () -> Unit) {
    val colorScheme = if (isSystemInDarkTheme()) darkColorScheme(primary = Purple80)
                      else lightColorScheme(primary = Purple40)

    MaterialTheme(
        colorScheme = colorScheme,
        typography = AppTypography,
        content = content
    )
}

Wrapping your app’s root composable in AppTheme means every MaterialTheme.colorScheme/typography reference throughout your composables automatically respects light/dark mode and your brand’s color tokens, with zero per-screen theming logic.

PreviousNext