Is this a bug? Watch the scrollState.value go from 864 to 0 when the Row gets composed twice (for no obvious reason). This leads to the scroll position not being retained.

what is ImagePreview? Is it something that asynchronously loading the Images so while they are loading the items heights are 0?

@Andrey Kulikov

private fun ImagePreview(
    image: File,
    onImageClick: (File) -> Unit
) {
    val onClick = { onImageClick.invoke(image) }

    Card(
        modifier = Modifier
            .clickable { onClick.invoke() }
            .fillMaxWidth()
            .padding(16.dp)
    ) {
        Image(
            modifier = Modifier.clickable { onClick.invoke() },
            painter = rememberCoilPainter(image),
            contentDescription = ""
        )
    }
}

yes, when you use painterResource() the image is loaded synchonously so the Image has the final height straightaway. when you use rememberCoilPainter it is loaded asynchronously, and for the first few frames all of the Images have the 0 height. which means there is 0 sized scrollable container, so the scroll position has to be reset to 0

How do i avoid this?

in general when you use

rememberCoilPainter()

it is recommended to predefine the size of the component with some meaningful width and height so it doesn’t jump when you load the images. it is even more important for images inside LazyColumn/LazyRow as there the item sizes are used in order to calculate the amount of needed items. or if you just use the local images from resources use painterResource()

This fixed it. Thank you so much @Andrey Kulikov i was actually losing hope and was thinking about falling back to using old RecyclerViews..

yeah, unfortunately there are still a lot of new concepts and things to understand with Compose. but please don’t lose your hope and file bugs if you think there are some aspects we can improve! 🙂

Thats true, this is something i would’ve never came up with by myself 😄