Scroll fast viewPager with images in LruCache

Question

I have a viewPager that have 4 images that need to resize. I implemented different options but no options run. I write the different options:

1. In getView put:

   image.setImageBitmap(bitmap);
   

   The bitmap obtain:

   BitmapFactory.Options options = new BitmapFactory.Options();
   options.inJustDecodeBounds = true;
   BitmapFactory.decodeStream(bitmapOriginal, null, options);
   int sampleSize = 1;
   while ((options.outHeight > 600 * sampleSize) &&(options.outWidth > 400 * sampleSize)) {  
       sampleSize *= 2;
   }
   options.inJustDecodeBounds = false;
   options.inMutable = false;
   options.inSampleSize = sampleSize;
   Bitmap bm=BitmapFactory.decodeStream(bimapOriginal, null, options);
   

But it's very slowly.

1. I put the last code in AsyncTask() but I can't scroll quickly.

2. I override the

   onPageScrollStateChange(int state)
   

   I only show the image when the state is SCROLL_STATE_IDLE but the effect is the same as in the other cases.

3. I use LruCache, I save the images in LruCache in Asynctask.
   In instantiateItem I put

   for(int i=position *4;i<(position +1)*4 +4;i++) {
   //NameImage is an Array with the name of image. Every time that calling instantiateItem save 4 images in LruCache
   new BitmapWorkerTask(nameImage[i).executorOnExecutor(AsyncTask.THREAD_POOL_EXECUTOR, null);
   

But the problem is the same as last cases, I can't scroll quickly and the app are so slowly.
I have images with a big quality and size. How can I do to scroll quickly in viewPager?

Answer 1

The problem is that even though your work is being done in AsyncTask but the ViewPager is waiting for you to return the image(in getView(), instanciateItem(),newView() etc whatever you are using). What you need to do is create several instances of ImageViews and return one of them almost immediately(this speeds things up). Let the AsyncTask do its loading and when it returns(to the corrct instance identified by position), the image is set to the instance which is already in the ViewPager by now.

Create an Array of imageviews to use as buffer and identify them using the position attribute of list item.

ImageView[] bufferView=new ImageView[4]; //global

//use Async task something like this

@Override       
   protected void onPostExecute(Bitmap result) {
   virtualPosition = position % 4;    //Real position % (number of ImageViews)   
   bufferView[virtualPosition].setImageBitmap(result);          
   }

return this bufferView[virtualPosition] as ImageView for this item

EDIT: Don't forget to add it to parent ViewGroup too

container.addView(pageview[position]);

Answer 2

I wrote an Android Image Manager that handles caching transparently (memory and disk). The code is on Github.

It uses a Handler instead of AsyncTasks. I've been using it for an image heavy application that contains grids and lists all around, the scrolling and load performance has improved significantly. Check it out: https://github.com/felipecsl/Android-ImageManager