How can I display a bitmap in Compose Image

Question

I have a function that returns a bitmap (which "contains" a QR code) and I wanted to display that bitmap inside an Image (composable function) but I didn't find any way to either convert the bitmap into a ImageBitmap or just displaying that bitmap.

Answer 1

Based on this blog post, it should be possible to display a bitmap like this :

@Composable
fun BitmapImage(bitmap: Bitmap) {
    Image(
        bitmap = bitmap.asImageBitmap(),
        contentDescription = "some useful description",
    )
}

I haven't tried it out myself, but recently came across the blog post when looking into displaying maps using Jetpack Compose.

Answer 2

Coil is capable of displaying a Bitmap inside Image:

Image(
    painter = rememberAsyncImagePainter(imageBitmap),
    contentDescription = null,
)

Answer 3

To sum up and keep answers up to date)

There are several options to display a bitmap in Compose

1. Using Image

   Image( bitmap = bitmap.asImageBitmap(), ...)

2. Using Coil AsyncImage

   AsyncImage(model = bitmap, ...)

If you have Unsupported bla bla exception when using AsyncImage, check that you are using Bitmap and not ImageBitmap