Ați lucrat vreodată cu componenta Collapsing Toolbar în Jetpack Compose?

În Jetpack Compose nu există o componentă încorporată de Toolbar Colapsabil, ca în Android clasic cu CoordinatorLayout și AppBarLayout. Cu toate acestea, se poate implementa un comportament similar folosind LazyColumn sau NestedScrollConnection, urmărind derularea și modificând dimensiunea sau vizibilitatea componentului de sus.

Exemplu de implementare simplificată a unei toolbar colapsabile:

var toolbarHeight by remember { mutableStateOf(200.dp) }
val scrollState = rememberLazyListState()

LaunchedEffect(scrollState.firstVisibleItemScrollOffset) {
    toolbarHeight = (200 - scrollState.firstVisibleItemScrollOffset.dp).coerceAtLeast(56.dp)
}

Column {
    Box(modifier = Modifier
        .height(toolbarHeight)
        .fillMaxWidth()
        .background(Color.Blue)) {
        Text("Toolbar Colapsabil", color = Color.White, modifier = Modifier.align(Alignment.Center))
    }
    LazyColumn(state = scrollState) {
        items(100) { index ->
            Text("Item #$index", modifier = Modifier.padding(16.dp))
        }
    }
}

Pentru cazuri mai complexe, se pot folosi biblioteci sau crea soluții personalizate cu API-urile NestedScroll.