Function

navigation

Construct a nested NavGraph

@Sampled
@Composable
fun NavWithArgsInNestedGraph() {
    val navController = rememberNavController()
    NavHost(navController, startDestination = Profile) {
        composable<Profile> { ProfileWithArgs(navController) }
        navigation<Dashboard>(startDestination = NestedWithArg::class) {
            composable<NestedWithArg> {
                // argument from parent graph Destination.Dashboard will automatically be
                // bundled into the start destination's arguments
                val userId = it.toRoute<NestedWithArg>().userId
                Dashboard(navController, userId)
            }
        }
    }
}

SizeTransformNav

@Sampled
@Composable
fun SizeTransformNav() {
    val navController = rememberNavController()
    Box {
        NavHost(navController, startDestination = Collapsed) {
            navigation<NestedGraph>(
                enterTransition = { EnterTransition.None },
                exitTransition = { ExitTransition.None },
                startDestination = InnerCollapsed::class,
                sizeTransform = {
                    SizeTransform { initialSize, targetSize ->
                        keyframes {
                            durationMillis = 500
                            IntSize(
                                initialSize.width,
                                (initialSize.height + targetSize.height) / 2,
                            ) at 150
                        }
                    }
                },
            ) {
                composable<InnerCollapsed>(
                    enterTransition = { EnterTransition.None },
                    exitTransition = { ExitTransition.None },
                ) {
                    ExpandedScreen {}
                }
            }
        }
    }
}
Jetpack Compose beyond MaterialFree components, screens and templates for apps that don’t look like Google’s. Copy them into your app, or let your coding agent add them.Browse for free

Content updated: