Lets say we have a main screen with a `Scaffold`.T...

# compose

[Lilly]

Lets say we have a main screen with a Scaffold.The Scaffold has a BottomNavigation and a TopAppBar. Navigating between the child screens means switching the content of the Scaffold. How can I have different TopBar actions on each screen? Do I have to drop the TopAppBar of the main screen and let the child screens have its own Scaffold with TopAppBar ? Another possibility I'm aware of would be to pass down the related TopBar composable and switch it on screen change like I do it with the screen content?

[mattinger]

You’ll need to create some kind of UIState object which can be altered as the user navigates around. How you alter it is really dependent on your actual method of navigation. But generally, you’d have to pass down the current state and a way to alter it:

@Composable
fun SomeTab(
    uiState: UIState,
    onUpdateUIState: (UIState) -> Unit
) {

    LaunchedEffect(key1=true) {
        onUpdateUIState( uiState.copy(....) )
    }

    // content goes here
}

Or something of this nature

[mattinger]

If you want the additive effect of actions that you have with fragments and menu inflation, you could use DisposableEffect instead, and alter the UIState when the composable goes away as well

[mattinger]

DisposableEffect(key1=true) {
    onUpdateUIState(
       uiState.copy( /* Add actions, set title, etc.... */ )
    )
    onDispose {
        onUpdateUIState(
            uiState.copy( /* Remove actions */ )
        )
    }

[Lilly]

Ah ok the second example makes it clear what you mean. Yeah this covers my second approach but with a state object instead of a composable. I guess this is the only valid solution. Thanks for the hint