ConfDocs
ConfDocs copied to clipboard
Lazy layouts in Compose
- https://youtu.be/1ANt65eoNhQ
RecyclerView
=
@Composable
fun FlowerList(flowers: List<Flower>) {
LazyColumn {
items(flowers) { flower ->
FlowerItem(flower)
}
}
}
@Composable
fun FlowerItem(flower: Flower) {
Column {
Image(flower.image)
Text(flower.name)
}
}
LazyColumn {
// LazyListScope block
item {
Text(header)
}
items(data) { item ->
Item(item)
}
itemsIndexed(data) { index, item ->
Item(item, index)
}
}
:x: DON'T DO THIS
LazyRow(
modifier = Modifier.padding(
start = 24.dp,
end = 24.dp
)
) {
items(data) { item ->
Item(item)
}
}
:white_check_mark: DO THIS
LazyRow(
contentPadding = PaddingValues(
start = 24.dp,
end = 24.dp
)
) {
items(data) { item ->
Item(item)
}
}
val state = rememberLazyListState()
LazyColumn(
state = state
) {
items(data) { item ->
Item(item)
}
}
state.firstVisibleItemIndex
state.firstVisibleItemScrollOffset
val showScrollToTopButton by remember {
derivedStateOf {
state.firstVisibleItemIndexn> 0
}
}
state.layoutInfo.visibleItemsInfo
state.layoutInfo.totalItemCount
state.layoutInfo.visibleItemsInfo
.map { it.index }