I m trying to do an infinite list with `LazyColumn` without kotlinlang #compose

val listState = rememberLazyListState()
        LazyColumn(
            modifier = Modifier.fillMaxWidth(),
            state = listState,
            contentPadding = PaddingValues(all = 8.dp),
            verticalArrangement = Arrangement.spacedBy(8.dp)
        ) {

            itemsIndexed(items) { index, i ->
                ContactRow(
                    imageUrl = "<https://via.placeholder.com/150?text=User$i>",
                    initials = "LM$i",
                    fullName = "Luis Mierez $i",
                    email = "lmierez$i@gmail.com"
                )

            }
        }
        val loadMore = remember {
            derivedStateOf {
                val layoutInfo = listState.layoutInfo
                val totalItemsNumber = layoutInfo.totalItemsCount
                val lastVisibleItemIndex = (layoutInfo.visibleItemsInfo.lastOrNull()?.index ?: 0) + 1

                val loadMore = lastVisibleItemIndex > (totalItemsNumber - buffer)
                loadMore
            }
        }

        LaunchedEffect(key1 = loadMore) {
            snapshotFlow { loadMore.value }
                .distinctUntilChanged()
                .collect {
                    Timber.d("Load more: $it")
                }
        }

❤️ 1

this is currently working and the

Load more

log message triggers when it should, but I’m wondering if that is the correct usage of

LaunchedEffect

with

snapshotFlow

Shakil Karim

06/07/2021, 9:57 PM

what is the buffer value here? but it looks like the right approach.

:party-parrot: 1

Luis Mierez

06/07/2021, 9:59 PM

oh didn’t notice the value didn’t copy. But it just a value to trigger the eventual load more callback before the list gets to the bottom. So if you got 20 items, the load more callback will be called when you see item 20 - buffer

👍 1

right now I have it as a value of 2, but could be more or less depending on the use case

7 Views

#compose Join Slack