Some images become black after a few miliseconds

[Aerion]

Hello,

Some images are not displayed correctly: they appear, and after a few ms, in their place there is a black rectangle. Here is one example: https://images.timeguessr.com/c6c25f48-850b-4fdf-b961-cb98b434342a.jpg

I intially thought the issue was coming from coil, but it displays properly with AsyncImage.

I'm using zoomable-image-coil v0.13.0 and coil v2.6.0.

For reproduction

val url = "https://images.timeguessr.com/c6c25f48-850b-4fdf-b961-cb98b434342a.jpg"
    Column(modifier = Modifier.fillMaxSize()) {
        AsyncImage(
            model = url,
            contentDescription = null,
            modifier = Modifier.fillMaxSize(0.5f),
        )
        ZoomableAsyncImage(
            model = url,
            contentDescription = null,
            modifier = Modifier.fillMaxSize(0.5f),
        )
    }

https://github.com/user-attachments/assets/1ece807a-3152-44c3-9766-3b381c94cb90

Would you know what could be the cause of this issue?

Best,

[saket]

It seems like the image's color space is losing some information when it's converted between Android <> Compose UI formats. I'll investigate this further when time permits, but in the meantime can you try working around this by forcing a color space?

ZoomableAsyncImage(
  model = ImageRequest.Builder(LocalContext.current)
    .data("https://images.timeguessr.com/c6c25f48-850b-4fdf-b961-cb98b434342a.jpg")
    .colorSpace(ColorSpace.get(ColorSpace.Named.SRGB))
    .build(),
  …
)

[Aerion]

in the meantime can you try working around this by forcing a color space?

It seems to do the trick indeed, thanks for the prompt response!

[saket]

I think this is an issue in Compose UI. I filed an issue here: https://issuetracker.google.com/issues/377021410.

[saket]

0.14.0 is released with a workaround for this: https://github.com/saket/telephoto/releases/tag/0.14.0.