Why does the glide and picasso won't load the url image in Google Maps Marker?

Question

I am trying to load the image to my CircleImageView from a custom marker layout that I made. I tried to use glide or picasso but non of them works it is only showing the placeholder image of the marker. Can someone help me with this one. I am stuck for about 4hrs in this and still dont find what was causing this.

place2 = new MarkerOptions()
         .position(storeLatLng)
         .icon(BitmapDescriptorFactory.fromBitmap(createCustomMarker(CheckOutActivity.this , storeIMG, storeName))).title(storeClass);


...

private static Bitmap createCustomMarker(Context context, final String resource, String name) {

        View marker = ((LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.bitmap_google_marker_layout_item, null);
        de.hdodenhof.circleimageview.CircleImageView image = (de.hdodenhof.circleimageview.CircleImageView) marker.findViewById(R.id.user_dp);
        TextView txt_name = (TextView) marker.findViewById(R.id.name);
        txt_name.setText(name);
        
        //Glide.with(marker).load(resource).apply(new RequestOptions().placeholder(R.mipmap.loader)).into(image);
        Picasso.get()
                .load(resource)
                .placeholder(R.mipmap.loader)
                .error(R.drawable.error)
                .into(image);

        DisplayMetrics displayMetrics = new DisplayMetrics();
        ((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
        marker.setLayoutParams(new ViewGroup.LayoutParams(52, ViewGroup.LayoutParams.WRAP_CONTENT));
        marker.measure(displayMetrics.widthPixels, displayMetrics.heightPixels);
        marker.layout(0, 0, displayMetrics.widthPixels, displayMetrics.heightPixels);
        marker.buildDrawingCache();
        Bitmap bitmap = Bitmap.createBitmap(marker.getMeasuredWidth(), marker.getMeasuredHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        marker.draw(canvas);
        return bitmap;
    }

Here Is the sample image of the result

Answer 1

Picasso or Glid loads image asynchronously. At the time you are creating bitmap from view the ImageView have only placeholder(Picasso or Glid didn't download and set the image to the ImageView yet). So you can seeing placeholder in Marker. Once you have created Bitmap form View , anything change in the View later will not affect the bitmap.

To make Marker with the actual image you have to update or recreate marker again after Picasso download and set the Image in the ImageView.

I think it's better to make Marker with placeholder and update the Marker after downloading the Image.