How do I load url into Image into DrawImage in Compose UI Android Jetpack?

Question

I can use val image = +imageResource(R.drawable.header) and use DrawImage(image) to load image from Drawable Resource,

But how do I load a string url into the DrawImage(image)?. I've tried using Glide, but it needs to load into imageView. meanwhile DrawImage(image) doesn't take input from imageView.

Thanks.

Answer 1

Staring with 1.0.x the best way to achieve it is to use the Coil-Compose library.

Add in your build.gradle the dependency

dependencies {
    implementation("io.coil-kt:coil-compose:1.3.1")
}

Then just use:

Image(
    painter = rememberImagePainter("your url"),
    contentDescription = "My content description",
)

This loads the url passed in with rememberImagePainter, and then displays the resulting image using the standard Image composable.

Answer 2

Coil for Jetpack Compose

Another option to load an image from the internet.

Add the Coil dependency to build.gradle :

dependencies {
    implementation "io.coil-kt:coil-compose:1.4.0")
}

Simple use:

Image(
    painter = rememberImagePainter("https://picsum.photos/300/300"),
    contentDescription = stringResource(R.string.image_content_desc)
)

Don't forget to add the internet permission (AndroidManifest.xml)

<uses-permission android:name="android.permission.INTERNET"/>

More custom here: Jetpack Compose - Coil Document