Junior — Middle
Já trabalhou com o componente Collapsing Toolbar no Jetpack Compose?
sobes.tech IA
Resposta da IA
No Jetpack Compose há um componente incorporado de Toolbar Colapsável, como no Android clássico com CoordinatorLayout e AppBarLayout. No entanto, pode-se implementar um comportamento semelhante usando LazyColumn ou NestedScrollConnection, acompanhando a rolagem e alterando o tamanho ou a visibilidade do componente superior.
Exemplo de uma implementação simplificada de uma toolbar colapsável:
var toolbarHeight por 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 Colapsável", color = Color.White, modifier = Modifier.align(Alignment.Center))
}
LazyColumn(state = scrollState) {
items(100) { index ->
Text("Item #$index", modifier = Modifier.padding(16.dp))
}
}
}
Para casos mais complexos, pode-se usar bibliotecas ou criar soluções personalizadas com as APIs de NestedScroll.