Issue
I saw that a new parameter has recently been added to the Material3 Top App Bar Composables on Jetpack Compose:
fun CenterAlignedTopAppBar(
...
scrollBehavior: TopAppBarScrollBehavior? = null
) {}
What I understood from the href="https://developer.android.com/reference/kotlin/androidx/compose/material3/package-summary#CenterAlignedTopAppBar(kotlin.Function0,androidx.compose.ui.Modifier,kotlin.Function0,kotlin.Function1,androidx.compose.material3.TopAppBarColors,androidx.compose.material3.TopAppBarScrollBehavior)" rel="nofollow noreferrer">documentation is that this should enable us to implement the behaviour that the app bar hides at scrolling the content. However, I did not manage to implement this, as the only example I found on StackOverflow seems to no longer work on the latest version of Jetpack Compose and is giving the error No value passed for parameter 'state'
.
Can anybody provide an example?
What I want to achieve is a Scaffold
, where as topBar
a CenterAlignedTopAppBar
is provided, that scrolls out on top of the screen if the scrollable content
of the Scaffold
is scrolled.
Thanks a lot for your help.
Solution
I finally managed to get it to work:
val topAppBarScrollState: TopAppBarScrollState = rememberTopAppBarScrollState()
val scrollBehavior = remember { TopAppBarDefaults.enterAlwaysScrollBehavior(topAppBarScrollState) }
CenterAlignedTopAppBar(
modifier = modifier,
title = { Text(text = stringResource(id = titleResource)) },
actions = {
IconButton(
onClick = { }
) {
Icon(
imageVector = Icons.Filled.Settings,
contentDescription = null,
)
}
},
scrollBehavior = scrollBehavior
)
This only seems to be necessary since Compose version 1.2.0-rc02
though, as on older versions the solution in the post linked in my answer still works.
Answered By - BenjyTec
Answer Checked By - David Marino (JavaFixing Volunteer)