Loading an image from an URL in to customInfoWindow Google Maps

Question

am implementing google maps with custom info window. the window works fine, but for some reason, the image is not loading into my imageView. I don't see any errors also.

I am trying to load the image from URL into the imageView inside the custom marker info window

I want to load the image to the top. The image url Look like this. https://lh3.googleusercontent.com/p/AF1QipNP6n3JeoWAWo8WhS7-RTC0e3o-R04EUx7gJeOX=s1600-w1400

Java

  @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;

        mMap.getUiSettings().setZoomControlsEnabled(true);


        LatLng snowqualmie = new LatLng(Double.parseDouble(Latitude), Double.parseDouble(Longitude));

        MarkerOptions markerOptions = new MarkerOptions();
        markerOptions.position(snowqualmie)
                .title(Name)
                .snippet(Description)
                .icon(BitmapDescriptorFactory.defaultMarker( BitmapDescriptorFactory.HUE_BLUE));





        mMap.setInfoWindowAdapter(new GoogleMap.InfoWindowAdapter() {



            @Override
            public View getInfoWindow(Marker marker) {
                return null;
            }



            @Override
            public View getInfoContents(Marker marker) {
                View view = getLayoutInflater().inflate(R.layout.map_info_window, null);
                final ImageView infoImage = view.findViewById(R.id.info_image);
                TextView InfoName = view.findViewById(R.id.info_tv_name);
                TextView Lati = view.findViewById(R.id.Info_latitude);
                TextView Longi = view.findViewById(R.id.info_longitude);
                TextView Addres = view.findViewById(R.id.info_address);
                TextView Desc = view.findViewById(R.id.info_description);

                TextView msg_Address = findViewById(R.id.tv_msg_address);
                TextView msg_Description = findViewById(R.id.tv_msg_description);

                InfoName.setText(MapDisplay.Name);
                Lati.setText(MapDisplay.Latitude);
                Longi.setText(MapDisplay.Longitude);

                Picasso.with(context)
                        .load(Uri.parse(MapDisplay.ImageURL))
                        .fit().centerCrop()
                        .into(infoImage);

                    if (MapDisplay.Address == "" || MapDisplay.Address == null || MapDisplay.Address.length() == 0){
                        Addres.setText("No address added.");
                    }else {
                        Addres.setText(MapDisplay.Address);
                    }


                    if (MapDisplay.Description == "" || MapDisplay.Description == null || MapDisplay.Description.length() == 0){
                        Desc.setText("No description added.");
                    }else {
                        Desc.setText(MapDisplay.Description);
                    }

                return view;
            }
        });

        googleMap.setOnInfoWindowClickListener(this);


//        // Add a marker in Sydney and move the camera
        LatLng Location = new LatLng(Double.parseDouble(Latitude), Double.parseDouble(Longitude));
        mMap.addMarker(new MarkerOptions().position(Location).title(Name));
        mMap.moveCamera(CameraUpdateFactory.newLatLng(Location));
        CameraPosition cameraPosition = new CameraPosition.Builder().target(Location).zoom(16).build();
        mMap.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition));


    }

Can someone help me to fix this. tnx

Can you check getting URL is correct or not **Log** it and check that URL in to web browser — ND1010_, Dec 14 '17 at 08:32
yes url works fine. i have added the url link in the question. — Sathya Baman, Dec 14 '17 at 08:34
Try with loading image using Glide for this check my answer link: https://stackoverflow.com/questions/44198856/glide-does-not-resolve-its-method/46073833#46073833 — ND1010_, Dec 14 '17 at 08:38
please see this https://github.com/square/picasso/issues/500 — Mitesh Vanaliya, Dec 14 '17 at 10:01

score 1 · Answer 1 · answered Dec 14 '17 at 09:30

I have the same problem I will use below code:

private void setInfoWindow() {
    googleMap.setInfoWindowAdapter(new GoogleMap.InfoWindowAdapter() {
        @Override
        public View getInfoWindow(Marker marker) {
            return null;
        }

        @Override
        public View getInfoContents(Marker marker) {

            View v = View.inflate(this, R.layout.custom_info_window, null);
           ImageView imageViewPic = v.findViewById(R.id.img_event);
           Picasso.with(this).load(mUrl).resize(80, 70).centerInside().into(url);
           return v;
        }
    });
}

score 1 · Accepted Answer · answered Dec 14 '17 at 13:35

1

Try removing the Picasso's

.fit().centerCrop()

Control the image view size, scaling attributes via XML, where you defined the imageView ("info_image")

answered Dec 14 '17 at 13:35

Niroshan

1,174
1
12
30

score 0 · Answer 3 · answered Dec 14 '17 at 09:24

You should this code this help me ,

add this dependency :

compile 'com.github.bumptech.glide:glide:3.8.0'

and add this in when infowindow click:

 Glide.with(getActivity())
                            .load(Uri.parse(MapDisplay.ImageURL)).placeholder(R.drawable.img_profile_dumy)
                            .listener(new RequestListener<String, GlideDrawable>() {
                                @Override
                                public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
                                    return false;
                                }

                                @Override
                                public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
                                    if (marker.isInfoWindowShown()) {
                                        marker.hideInfoWindow();
                                        marker.showInfoWindow();
                                    }
                                    return false;
                                }
                            }).into(img_profile);

Use this First time glide not show the image but here when callback reaturn success then again show info window . this will help you.

Loading an image from an URL in to customInfoWindow Google Maps

3 Answers3