Is this a bug? Watch the scrollState.value go from 864 to 0 when the Row gets composed twice (for no...

# compose

[Artur Schwarz]

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.

Screen Recording 2021-07-12 at 19.48.38.mov

[Artur Schwarz]

Interestingly, this doesn’t happen when performing the first scroll and navigation from Fragment B back to Fragment A

[Artur Schwarz]

Retaining the Scoll Position when using Texts instead of Images works just fine. Is this a performance issue?

[Andrey Kulikov]

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

[Artur Schwarz]

@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 = ""
        )
    }
}

[Artur Schwarz]

Interestingly, the effect shown in the Video does not appear, when i use painterResource(R.drawable.some_drawable) instead of rememberCoilPainter(image)

[Artur Schwarz]

Regarding asynchonicity: I do load images from a media folder of the App asynchronously

[Andrey Kulikov]

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

[Artur Schwarz]

How do i avoid this?

[Andrey Kulikov]

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()

[Artur Schwarz]

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

[Andrey Kulikov]

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! 🙂

[Artur Schwarz]

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