androidandroid-jetpack-composeandroid-jetpackandroid-jetpack-compose-list

Jetpack Compose: LazyColumn does not render some items if animated scroll is interrupted and a new one is started


I'm currently trying out Android Jetpack Compose and want to implement a RecyclerView-like list using LazyColumn. However, when programatically scrolling (animated) to a certain item during a scroll by the user or during another programatic scroll (animated), some items in the list are not rendered. Is this a issue of Compose or did I implement the scrolling incorrectly?

As a simple example, the following code can be used:

class MainActivity : ComponentActivity() {
    @ExperimentalTime
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            val listState = rememberLazyListState()

            rememberCoroutineScope().launch {
                delay(10.seconds)
                listState.animateScrollToItem(1000)
                delay(100.milliseconds)
                listState.animateScrollToItem(0)
            }

            LazyColumn(
                state = listState,
                contentPadding = PaddingValues(1.dp),
            ) {
                items(1000) {
                    Text(
                        text = "$it",
                        modifier = Modifier
                            .padding(2.dp)
                            .clip(MaterialTheme.shapes.small)
                            .background(MaterialTheme.colors.onSurface)
                            .padding(8.dp)
                            .fillMaxWidth(),
                        color = MaterialTheme.colors.surface,
                        textAlign = TextAlign.Center,
                    )
                }
            }
        }
    }
}

I also recorded a sample video of the app: https://i.imgur.com/dKFn1VH.mp4.


Solution

  • It is a bug:

    https://issuetracker.google.com/issues/188566058

    It is fixed and expected in 1.0.0-beta08.