IssueTracker

Jetpack Compose version: 2023.01.00 Jetpack Compose component used: Scaffold Android Studio Build: 2022.1.1 Patch 1 Kotlin version: 1.8.0

The Scaffold component, when working with the collapsing toolbar, causes unnecessary recompositions of the list inside. This is caused by the fact that the Scaffold inside itself measures the height of the toolbar each time and passes it in the form of innerpading. What causes the recomposition of all visible list items when the toolbar collapses.

A simple example:

val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior()
val listState = rememberLazyListState()
val list = remember { (1..30).map { it.toString() } }

Scaffold(
modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
topBar = {
    LargeTopAppBar(
        title = { Text(text = "Title") },
        scrollBehavior = scrollBehavior
    )
},
) { innerPadding ->
    LazyColumn(
        state = listState,
        contentPadding = innerPadding
    ) {
        items(list, key = { id -> id }) { item ->
            Text(
                modifier = Modifier
                    .fillMaxWidth()
                    .height(80.dp),
                text = item
            )
        }
    }
}