I have a problem collapsing material3 LargeTopAppBar when scrolling the list programatically. Have a look at this gif, when scrolling by touch the app bar collapses correctly, when calling lazyListState.animateScrollToItem(45) the top bar wont collapse by itself:
Is there any way to collapse it correctly when scrolling the list programatically?
Here's the code, it's basically google's sample for TopBar:
setContent {
Material3PlaygroundTheme {
val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior()
val lazyListState = rememberLazyListState()
val coroutineScope = rememberCoroutineScope()
Scaffold(
modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
topBar = {
LargeTopAppBar(
title = {
Text(
"Large TopAppBar",
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
},
actions = {
IconButton(onClick = {
coroutineScope.launch {
lazyListState.animateScrollToItem(45)
}
}) {
Icon(
imageVector = Icons.Filled.Favorite,
contentDescription = "Localized description"
)
}
},
scrollBehavior = scrollBehavior
)
},
content = { innerPadding ->
LazyColumn(
state = lazyListState,
contentPadding = innerPadding,
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
val list = (0..75).map { it.toString() }
items(count = list.size) {
Text(
text = list[it],
style = MaterialTheme.typography.bodyLarge,
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 16.dp)
)
}
}
}
)
}
}