Myujth

Hello I have a viewpager with several pages(using a fragment state pager), and some pngs as backgrounds to those pages. I already followed the Displaying Bitmaps in the Ui (http://developer.android.com/training/displaying-bitmaps/display-bitmap.html) so I am already caching and setting the image drawable in a background thread. But I still get some lag when swithcing pages of the pager. On Each fragment, I only inflate the view on the onCreateView() method, so I have no Idea what may be causing this lag. What can I do to remove this lag/choppy effect?

I had similar problem.

I am showing tutorial-like pages. Each page is a full screen jpg.

At first, I put the pictures in res/drawablesfolder. The viewpager is very laggy when swiping it.

Then I move those jpgs to res/drawable-hdpi folder, the lag is gone.

I think different optimisations are done on the pictures based on folder. So we cannot put everything in res/drawable folder

You may want to try viewPager.setOffScreenLimit(size) to the number of your pages. This will load all the fragments once and keep from reloading them while swiping.

For removal of lag:

1)Put the images in res/drawable-hdpi if images are static.If it is downloaded from URL then use background thread for loading of images.

2) set page off screen limit by this method viewPager.setOffScreenLimit(size) . With the help of that view pager cache the minimum number of screen which you set in this method by default its value is 1.

3)You can use FragmentPagerAdapter and FragmentStatePagerAdapter for better performance.

My solution to avoid this lag when switching pages was: preload images

final Drawable images = new Drawable[3];
for(int i=0; i<3; i++)
 int position = i+1;
 images[i] = getResources().getDrawable(getResources().getIdentifier("image"+position, "drawable", getPackageName()));
 

and then:

mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() 
 @Override
 public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) 

 

 @Override
 public void onPageSelected(int position) 
 imageSwitcher.setImageDrawable(images[position]);
 

 @Override
 public void onPageScrollStateChanged(int state) 
 
 );

Building up on @coderek answer I seem to have solved this by fetching bitmaps without scaling them for specific densities:

BitmapFactory.Options opts = new BitmapFactory.Options();
opts.inScaled = false;
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), resource, opts);

((ImageView) view).setImageBitmap(bitmap);

Using an image from drawable folder in an xxhdpi device resulted in up to 8 times more memory being allocated!

P.S.:

You can also down sample the drawable if the resolution is too big:

opts.inSampleSize = 2;

I solved this by moving the images into drawable-nodpi, as this disables the scaling for all DPIs. Moving into hdpi/xhdpi will only disable scaling if the user is on a device with that screen density.

I know this is an old question, but I have run into it recently and discovered a different issue. So just sharing in case anyone comes across this post.

My fragments were all just big Imageview holders basically and scrolling through Images that the UX/UI team gave me. However, anytime the next or previous image was a different size i.e. (1200 x 1200) transitioning to (1200 x 1300) for example, that swipe would lag, but the rest would be fine.

Resolutions were in the correct folders. I experimented and found that if I cropped all images to the same size, I had no lag issues. However, that didn't fit my need as I wanted different size images.

So I switched to using Glide to load the image into place instead of setting the drawable directly and that cleaned it up very nicely. So if anyone else hits this issue, you may just need to switch to loading with glide asynchronously instead of setting directly the images.

I followed the answer of Coderek and moved it between the different

res/drawable-hdpi folders

drawable-xxxhdpi is what worked best for my project.

I had a similar problem too and, in my case, the lagging was caused by the background picture of the layouts which was too large. I just resized the picture and the swiping lag was gone