Ask Your Question
1

In Android Jetpack Compose, what is the process for configuring titles and buttons in the TopAppBar for child screens?

asked 2023-07-16 23:13:32 +0000

pufferfish gravatar image

edit retag flag offensive close merge delete

1 Answer

Sort by ยป oldest newest most voted
2

answered 2023-07-16 23:43:02 +0000

scrum gravatar image

To configure titles and buttons in the TopAppBar for child screens in Android Jetpack Compose, you can follow these steps:

  1. Create a Composable function for the TopAppBar, and pass in the required parameters such as title and actions.

  2. In the child screen Composable function, call the TopAppBar function passing the required parameters.

  3. Add any additional buttons or menus to the TopAppBar by using the IconButton or DropdownMenu Composables.

Example code for a TopAppBar with a title and a back button:

@Composable
fun MainScreen(navController: NavHostController) {
    Scaffold(
        topBar = { AppBar(title = "Main") }
    ) {
        // Main content here
    }
}

@Composable
fun ChildScreen(navController: NavHostController) {
    Scaffold(
        topBar = {
            AppBar(title = "Child", navigationIcon = {
                IconButton(onClick = { navController.popBackStack() }) {
                    Icon(Icons.Default.ArrowBack, contentDescription = "Back")
                }
            })
        }
    ) {
        // Child content here
    }
}

@Composable
fun AppBar(title: String, navigationIcon: @Composable (() -> Unit)? = null) {
    TopAppBar(
        title = { Text(text = title) },
        navigationIcon = navigationIcon
    )
}
edit flag offensive delete link more

Your Answer

Please start posting anonymously - your entry will be published after you log in or create a new account. This space is reserved only for answers. If you would like to engage in a discussion, please instead post a comment under the question or an answer that you would like to discuss

Add Answer


Question Tools

Stats

Asked: 2023-07-16 23:13:32 +0000

Seen: 10 times

Last updated: Jul 16 '23