I have ListView with text and large image from internet. My image item has fit width and wrap_content
height.
I tried to display image in background with UIL
& Picasso
. Both of them can work but the image always reloads when I stop scrolling, and it makes ListView flickering
It looks like this:
You can see that it reload downloaded and cached images when I stop scrolling (I scroll down and then scroll up).
How can I prevent this happen?
<ImageView android:id="@+id/imgFeed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"/>
// UIL
options = new DisplayImageOptions.Builder()
.showImageOnLoading(defaultImage)
.showImageOnFail(defaultImage)
.showImageForEmptyUri(defaultImage)
.resetViewBeforeLoading(false)
.cacheOnDisk(true).delayBeforeLoading(0)
.displayer(new FadeInBitmapDisplayer(200)).cacheInMemory(true).imageScaleType(ImageScaleType.EXACTLY_STRETCHED).build();
ImageAware imageAware = new ImageViewAware(viewHolder.imgFeed, false);
ImageLoader.getInstance().displayImage(item.getPhotoUrl(), imageAware, options);
// Picasso
Picasso.with(getContext())
.load(item.getPhotoUrl())
.placeholder(R.drawable.place_holder_big)
.resize(screenWidth, 0) //set max width
.into(viewHolder.imgFeed);
For UIL, I tried many ways in this issue but they don't work for me at all.
Update: seems I faced with memory cache issue like this question. But how can I fix this issue? Look at Facebook app, they did it very well. All images have different sizes with fit width, and very smooth scrolling without reloading images. How can they do that?
If you're wondering how Facebook did it, they actually released their image loading library (https://github.com/facebook/fresco)
Is it possible you are actually calling notifyDataSetChanged on the underlying ListView at that time? Also are you using hasStableIds()?
For UIL you could try using a WeakMemoryCache (refer to https://github.com/nostra13/Android-Universal-Image-Loader/wiki/Useful-Info) as that'll theoretically allow you to make use of all available memory though it may cause a lot of extra GC calls.
For Picasso Taha's method looks like your best bet!
Maybe your memory cache size is small and Picasso tries to load images from disc cache. Please check here for deciding cache size. You can try to increase cache size of Picasso by:
Picasso p = new Picasso.Builder(context)
.memoryCache(new LruCache(cacheSize))
.build();
However in my opinion your app looks like having an endless feed. Which means your memory cache will be full at some time and you'll have to use disc cache. Retrieving data from the disc cache is slower compared to memory cache.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With