How to display image in a listview from json response in android

Question

Hi in the below code am displaying data from json response using retrofit library. using recylerview am displaying title,id,albumid as well as image.all are displaying except image .

But how to display image from url. can any one please help me this is my adapter class.

.java

public class RecyclerViewAdapterForAlbum extends RecyclerView.Adapter<RecyclerViewAdapterForAlbum.ViewHolder> {

    private List<UserAlbum> item;
    Context context ;

    public RecyclerViewAdapterForAlbum(Context context, List<UserAlbum> item ) {
        Log.d("123", "RecyclerViewAdapter");
        this.item = item;
        this.context = context;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        Log.d("123", "onCreateViewHolder");
        View view = LayoutInflater.from(context).inflate(R.layout.activity_second, null);

        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        Log.d("123", "onBindViewHolder");
        holder.user_id.setText(String.valueOf(item.get(position).getId()));
        holder.album_id.setText(String.valueOf(item.get(position).getAlbumId()));
        holder.title.setText(item.get(position).getTitle());
        //Bitmap getBitMapFromUrl=null;
       holder.imageForText.setImageResource(item.get(position).getThumbnailUrl());
    }

    @Override
    public int getItemCount() {
        Log.d("123", "getItemCount");
        return item.size();
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        public TextView album_id, user_id,title;
        public ImageView imageForText;

        public ViewHolder(View itemView) {
            super(itemView);
            Log.d("123", "ViewHolder");


            user_id = (TextView) itemView.findViewById(R.id.user_id);
            album_id=(TextView)itemView.findViewById(R.id.album_id);
            title=(TextView)itemView.findViewById(R.id.title);
            imageForText=(ImageView)itemView.findViewById(R.id.img_id);


            itemView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
//                    int pos = getAdapterPosition();
//                    int userID=item.get(pos).getId();
//                    Intent myIntent = new Intent(v.getContext(), SecondActivity.class);
//                    myIntent.putExtra("userId",userID);
//                    context.startActivity(myIntent);

                }
            });
        }


    }
}

You only have the url of the image in the son. You need to fetch the actual image first. I'd recommend using a library like [Picasso](http://square.github.io/picasso/) — user8886048, Nov 14 '18 at 11:27
You can use [picasso](http://square.github.io/picasso/) , or [Glide](https://github.com/bumptech/glide) — Rumit Patel, Nov 14 '18 at 11:29
Possible duplicate of [Load image from url](https://stackoverflow.com/questions/5776851/load-image-from-url) — ADM, Nov 14 '18 at 11:32

score 1 · Answer 1 · answered Nov 14 '18 at 11:28

1

You can use library for that, like Picasso

implementation 'com.squareup.picasso:picasso:2.71828'

To use it :

Picasso.get().load("IMG URL").into(YOURIMAGEVIEW);

answered Nov 14 '18 at 11:28

Benjamin

401
1
3
16

score 1 · Answer 2 · answered Nov 14 '18 at 11:32

You have to use such type of libaray like picasso or universal image loader etc for load image on Your ImageView like in this I am using picaso

implementation 'com.squareup.picasso:picasso:2.71828'

Picasso.get().load(item.get(position).getThumbnailUrl()).into(imageForText);

score 1 · Accepted Answer · answered Nov 14 '18 at 11:33

Using Picasso:

Add this line to your app-level build.gradle file.

implementation 'com.squareup.picasso:picasso:2.71828'

And you can simply set image to ImageView by:

Picasso.get().load(item.get(position).getThumbnailUrl()).into(holder.imageForText);

Using Glide:

Add these lines to your app-level build.gradle file.

implementation 'com.github.bumptech.glide:glide:4.8.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'

And you can simply set image to ImageView by:

GlideApp.with(this).load(item.get(position).getThumbnailUrl()).into(holder.imageForText);

How to display image in a listview from json response in android

3 Answers3

Linked