如何从URL在imageView中显示图像

Question

I have a gridview which includes some images, when I click on one of them it comes up with some text but not the image itself as I want the image to load from a url. I'm using picasso to load the images as I found this the easiest approach, please advise what am I doing wrong

smiles_items_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="wrap_content"
android:layout_height="wrap_content">

<ImageView android:id="@+id/smile_image_view"
    android:layout_width="45dp"
    android:layout_height="45dp"
    android:layout_gravity="center"/>
</LinearLayout>

BottomSheetDialog_Smiles.java

@Override
    public View getView(final int position, final View convertView,
                        ViewGroup parent) {

        final Holder holder = new Holder();
        LayoutInflater inflater = (LayoutInflater)

getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        grid = inflater.inflate(R.layout.smiles_items_layout, null);

        holder.img = (ImageView) grid.findViewById(R.id.smile_image_view);
        holder.img.setImageResource(mThumbIds[position]);

        gridView2.setOnItemClickListener(new 
AdapterView.OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, 
                   int i, long l) {

               JSONDictionary imageChat = new JSONDictionary();
               Picasso.with(context)
                        .load("https://wallpapercave.com/wp/JUwBXRw.jpg")
                        .resize(50,50).into(holder.img);
                imageChat.put("message", holder.img);
                Communicator.getInstance().emit("new chat message", 
                imageChat);

            }
        });

        return grid;

    }
}

This is the result that displays

Answer 1

I have a gridview which includes some images, when I click on one of them it comes up with some text but not the image itself as I want the image to load from a url.

=> Reason behind you are seeing object address is because you are passing ImageView in chat message.

imageChat.put("message", holder.img);

Rather you should just pass an image address like:

imageChat.put("image_to_load", "https://wallpapercave.com/wp/JUwBXRw.jpg");

and on receiver side, write a code to load image using same code:

Picasso.with(context)
       .load("https://wallpapercave.com/wp/JUwBXRw.jpg")
       .resize(50,50).into(holder.img);

Because Picasso helps you in loading images asynchronously from given URLs, so you should make a call when it's actually required. In your case, images should be loaded on receiver side.

Answer 2

In my app I do something like that:

Glide.with(getActivity()).load(url)
     .diskCacheStrategy(DiskCacheStrategy.SOURCE)
     .centerCrop().into(imageview);