How to set image on marker Whereas image is stored in Firebase storage

Issue

I want to set image on marker. Image is stored in firerebase storage and I have download link of image. Now How can I set that image on marker

public void onMapReady(GoogleMap googleMap) {
    mMap = googleMap;
    reference = reference.child("Profile");
    reference.addValueEventListener(new ValueEventListener() {
        @Override
        public void onDataChange(DataSnapshot dataSnapshot) {

            for(DataSnapshot ds:dataSnapshot.getChildren()){
                latitude = (Double) ds.child("Latitude").getValue();
                longitude = (Double) ds.child("Longitude").getValue();
                String name=(String) ds.child("Name").getValue();
                String imgUrl = (String) ds.child("imageURL").getValue();//Here is image Url of marker
                LatLng latLng = new LatLng(latitude,longitude);
                mMap.addMarker(new MarkerOptions().position(latLng).title(name));
                mMap.moveCamera(CameraUpdateFactory.newLatLngZoom(latLng, 10));

            }
        }
        @Override
        public void onCancelled(DatabaseError databaseError) {

        }
    });
}

Solution

After too much research I found a way, but you will need Glide to work. This code is in Kotlin. Once you have the url with the image in storage firebase. Call Glide this way to transform the url link in a bitmap. Thanks to glide this is easy:

       var bitmapFinal : Bitmap?

        Glide.with(this)
         .asBitmap()
         .load(link)
         .into(object : CustomTarget<Bitmap>(){
            override fun onResourceReady(resource: Bitmap, transition: Transition<in Bitmap>?) {

                bitmapFinal = createUserBitmapFinal(resource)  //here we will insert the bitmap we got with the link in a placehold with white border.

                val mark1 = mMap.addMarker(MarkerOptions().position(latLng).title("Você está aqui").icon(BitmapDescriptorFactory.fromBitmap(bitmapFinal)))

                mark1.tag=0

                mMap.setOnMarkerClickListener (this@MapsActivity)

            }
            override fun onLoadCleared(placeholder: Drawable?) {
                // this is called when imageView is cleared on lifecycle call or for
                // some other reason.
                // if you are referencing the bitmap somewhere else too other than this imageView
                // clear it here as you can no longer have the bitmap
            }
        })

At this point, you could insert the bitmap (resource) directly in marker, just tweeking the code above. But if you want to use a placeholder with a white border of any other thing, use this code, whereas bitmapInicial is the bitmap you just get in Glide above:

private fun createUserBitmapFinal(bitmapInicial: Bitmap?): Bitmap? {
    var result: Bitmap? = null
    try {
        result = Bitmap.createBitmap(dp(62f), dp(76f), Bitmap.Config.ARGB_8888) //change the size of the placeholder 
        result.eraseColor(Color.TRANSPARENT)
        val canvas = Canvas(result)
        val drawable: Drawable = resources.getDrawable(R.drawable.placeholder) 
        drawable.setBounds(0, 0, dp(62f), dp(76f)) //change the size of the placeholder, but you need to maintain the same proportion of the first line
        drawable.draw(canvas)
        val roundPaint = Paint(Paint.ANTI_ALIAS_FLAG)
        val bitmapRect = RectF()
        canvas.save()

        if (bitmapInicial != null) {
            val shader =
                BitmapShader(bitmapInicial, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP)
            val matrix = Matrix()
            val scale: Float = dp(104f) / bitmapInicial.width.toFloat()  //reduce or augment here change the size of the original bitmap inside the placehoder. But you need to adjust the line bitmapRect with the same proportion
            matrix.postTranslate(5f, 5f) 
            matrix.postScale(scale, scale)
            roundPaint.shader = shader
            shader.setLocalMatrix(matrix)
            bitmapRect[10f, 10f, 104f+10f]=104f+10f    //change here too to change the size
            canvas.drawRoundRect(bitmapRect, 56f, 56f, roundPaint)  
        }

        canvas.restore()
        try {
            canvas.setBitmap(null)
        } catch (e: java.lang.Exception) {
        }
    } catch (t: Throwable) {
        t.printStackTrace()
    }
    return result
}

fun dp(value: Float): Int {
    return if (value == 0f) {
        0
    } else Math.ceil(resources.displayMetrics.density * value.toDouble()).toInt()
}

fonts: How does one use glide to download an image into a bitmap?

Answered By - Thiago Silva