1

I'd like to set a marker on a Google Map displayed by an Android Kotlin app to be a URL of my choice. It's clear that fetching the URL content needs to be done off the UI thread, and that coroutines are the approach here, so I'd like to run a few lines of code to fetch the URL and put it into a BitmapDescription object inside a coroutine, and then use that BitmapDescription to call setIcon on the Marker object to set the custom image.

I already have a Marker, and a URL. So I tried this:

    uiScope.launch(Dispatchers.IO) { // not sure this is the best way to launch in IO
        val furl = URL(myURL)
        val bm = BitmapFactory.decodeStream(furl.openConnection().getInputStream())
        val bd = BitmapDescriptorFactory.fromBitmap(bm)
        uiScope.launch(Dispatchers.Main) { // go back to UI thread; this crashes
            marker.setIcon(bd)
        }
    }

This is obviously not right because it crashes. The fetch of the URL and creating a BitmapDescriptor seems to be working fine as far as I can tell; once I have that BitmapDescriptor, how do I call marker.setIcon with it?

1 Answer 1

2
+100

Although you said that fetching the image and creating BitmapDescriptor seems to be working fine, I can almost say that it is not right to do it yourself using an URL connection. The procedure of fetching and decoding images might involve many possible errors that could not be handled this way. It's better to delegate this responsibility as well as thread switching to a reliable tool such as Glide.

Let's write an extension function for the Marker using Glide in a kotlin file:

ExtensionFunctions.kt

import android.content.Context
import android.graphics.Bitmap
import com.bumptech.glide.Glide
import com.bumptech.glide.load.DataSource
import com.bumptech.glide.load.engine.GlideException
import com.bumptech.glide.request.RequestListener
import com.bumptech.glide.request.target.Target
import com.google.android.gms.maps.model.BitmapDescriptorFactory
import com.google.android.gms.maps.model.Marker

fun Marker.loadIcon(context: Context, url: String?) {
    Glide.with(context)
        .asBitmap()
        .load(url)
        .error(R.drawable.default_marker) // to show a default icon in case of any errors
        .listener(object : RequestListener<Bitmap> {
            override fun onLoadFailed(
                e: GlideException?,
                model: Any?,
                target: Target<Bitmap>?,
                isFirstResource: Boolean
            ): Boolean {
                return false
            }

            override fun onResourceReady(
                resource: Bitmap?,
                model: Any?,
                target: Target<Bitmap>?,
                dataSource: DataSource?,
                isFirstResource: Boolean
            ): Boolean {
                return resource?.let {
                    BitmapDescriptorFactory.fromBitmap(it)
                }?.let {
                    setIcon(it); true
                } ?: false
            }
        }).submit()
}

Now. it's just enough to call it over a marker object to load the image for it asynchronously:

marker.loadIcon(context, url)
1
  • 1
    Yeah, a whole bunch of suggestions boil down to "use Glide for this", and I'm leaning in that direction. I was loath to add another dependency to the app, but probably it's the simplest way; thank you for the pointers and the worked example!
    – sil
    Aug 23, 2020 at 15:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.