How to download Images (thousand of images) and render them in ListAdapter in android?

Question

My task is to download the images URL using Rest call and render them into ListView using Android adapter. For making Rest call I am using retrofit which is returning a Json (that Json have URL of images).

I am using picasso to download the images from server and rendering them into Listview. Everything works fine because I only have couple of Images to download right now.

How can I achieve the task when I will have more than 500 Images to download. What would be the best way to do it.

MyAdapter class

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

 ImageView imageView = (ImageView) convertView.findViewById(R.id.imageView);

 Picasso
      .with(context)
      .load("http://i.imgur.com/rFLNqWI.jpg")
      .transform(imageTransformation)
      .into(imageView);
 return convertView;
}

Above code is very simple i.e. rendering the one image on the basis of count. Any help would be appreciable.

Is this the right way to run the loop on the basis of count(imagesURL) and download them using picasso in above code? Or is there are any better solution ?

Edit-2

I think I misunderstood you guys. My question is How to implement above scenario when I will have 1000 images URL.

picasso is great just set that LRU would be big enough for all the photos.. — Itzik Samara, Sep 16 '15 at 18:23
But how to achieve the above scenario. So that App will not get hang — Amit Pal, Sep 16 '15 at 18:26
check out this link http://blog-emildesign.rhcloud.com/?p=952 it describes how to load images Async — Itzik Samara, Sep 16 '15 at 18:28
[It does not help?](http://stackoverflow.com/a/26118645/2413972) — user2413972, Sep 16 '15 at 18:41
@user24139...This is not my question. I have already implemented it. What I am asking the best way to work the above scenario when I will have more than 1000 of images — Amit Pal, Sep 16 '15 at 18:43

ClarkXP · Answer 1 · 2015-09-16T18:46:28.187

Using Picasso into getView method is OK. But you must use Holder Pattern to save the ImageView's instances.

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

    ViewHolderItem viewHolder;


    if(convertView==null || !(convertView.getTag() instanceof ViewHolderItem )){

        // inflate the layout
        LayoutInflater inflater = ((Activity) context).getLayoutInflater();
        convertView = inflater.inflate(layoutResourceId, parent, false);

        // well set up the ViewHolder
        viewHolder = new ViewHolderItem();
        viewHolder.imageViewItem = (ImageView) convertView.findViewById(R.id.imageView);

        // store the holder with the view.
        convertView.setTag(viewHolder);

    }else{
        // we've just avoided calling findViewById() on resource everytime
        // just use the viewHolder
        viewHolder = (ViewHolderItem) convertView.getTag();
    }




  Picasso
      .with(context)
      .load("http://i.imgur.com/rFLNqWI.jpg")
      .transform(imageTransformation)
      .into(viewHolder.imageViewItem);




    return convertView;

}

static class ViewHolderItem {
    ImageView imageViewItem;
}

I have already implemented it. I think I misunderstood you. What if You have Array of 1000 URL. How will you implement the above code ? — Amit Pal, Sep 16 '15 at 18:45
With ViewHolder pattern implemented, shouldn't have issues. Picasso has caching system out-the-box — ClarkXP, Sep 16 '15 at 18:49
Now thinking in a better performance, maybe you should migrate to [RecyclerView](https://developer.android.com/training/material/lists-cards.html) — ClarkXP, Sep 16 '15 at 19:09

score 0 · Answer 2 · answered Sep 16 '15 at 19:36

Not entirely sure what you're asking as Picasso already handles caching and it's actually meant for loading lots of images in a listview. I will try to answer as best as I can.

If you've already got to load one image, then you can use the same concept to load 500.

Couple things to note however:

In your adapter's #getView() function, remember to recycle and follow ViewHolder pattern if you don't want your listview to hang
You can also use RecyclerView instead of a ListView as the adapter will force you to implement ViewHolders.

Below code is a quick and basic example. Please don't mind the syntax. I just wanted to point out the most important parts.

public class SampleActivity extends Activity {
   MyAdapter mMyAdapter;
   public void onCreate(...) {
      super.onCreate(...);
      setContentView(...);
      List<String> listOfImages = new ArrayList<String>();
      // code here for adding/retrieving the image urls
      mMyAdapter = new MyAdapter(listOfImages);
      ListView listView = findViewById(...);
      listView.setAdapter(mMyAdapter);
   }    
}

public class MyAdapter extends BaseAdapter {
   List<String> mListOfImages;
   public MyAdapter(List<String> images) {
       mListOfImages = images;
   }
   public int getCount() {
       return mListOfImages.size();
   }

   ...
   ...

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

      ViewHolder holder = convertView.getTag();
      if (holder == null) {
         holder = new ViewHolder();
         convertView.setTag(holder);
      }
      if (holder.mImageView == null) {
         ImageView imageView = (ImageView) convertView.findViewById(R.id.imageView);
         holder.mImageView = imageView;
      }

      Picasso
         .with(convertView.getContext())
         .load(mListOfImages.get(position))
         .transform(imageTransformation)
         .into(holder.mImageView);
       return convertView;
   }

   public static class ViewHolder {
      public ImageView mImageView;
   }
}

Hope this helps.

How to download Images (thousand of images) and render them in ListAdapter in android?

MyAdapter class

Edit-2

2 Answers2