Home » Android » Repetition of image while scrolling in Android grid view using Universal Image Loader

Repetition of image while scrolling in Android grid view using Universal Image Loader

Posted by: admin June 15, 2020 Leave a comment


I am trying to load images from the Internet using Universal Image Loader on a gridview using the below code.

public View getView(int position, View converView, ViewGroup parent) {
        Log.v("Description", "Description is " + position);
        ViewHolder mVHolder;
        if (converView == null) {
            LayoutInflater vi = (LayoutInflater) conted.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            converView = vi.inflate(R.layout.customgrid, null);
            mVHolder = new ViewHolder();
            mVHolder.mImageView = (ImageView) converView
            mVHolder.mTextView1 = (TextView) converView
            mVHolder.mTextView2 = (TextView) converView
            mVHolder.mTextView3 = (TextView) converView

        } else {
            mVHolder = (ViewHolder) converView.getTag();
        // mVHolder.mImageView.setImageResource(mThumbIds[position]);
        // mVHolder.mImageView.setImageDrawable(LoadImageFromURL(
        // mThumbIds[position]));
        imageLoader.displayImage(mThumbIds[position],mVHolder.mImageView,options, animationListener);
        Log.v("Names",NAMES[position] + STATES[position] + CONSTITUENCY[position]);
        return converView;

However, when I scroll down in the list, the first image of the first row seems to repeat in most of the grids. It does not stay all the time – it changes back to the original image after a while. My question is, is this a issue with view inflation on gridview or image loading of Universal Image Loader?

How to&Answers:

I think your problem is that you are not setting the resetViewBeforeLoading() method for DisplayImageOptions like this:-

     DisplayImageOptions options = new DisplayImageOptions.Builder()
 ---->   .resetViewBeforeLoading(true)<----very important for recycling views
    .imageScaleType(ImageScaleType.IN_SAMPLE_POWER_OF_2) // default
    .bitmapConfig(Bitmap.Config.ARGB_8888) // default
    .displayer(new SimpleBitmapDisplayer()) // default

and then apply this DisplayImageOptions.

        imageLoader.displayImage(mThumbIds[position],mVHolder.mImageView,options,                   animationListener);


Another solution is to use setTag() for identify view:

class ViewHolder {
    ImageView thumbnail;
    public boolean isSameView(String tag) {
        if (tag == null) {
            return thumbnail.getTag() == null;
        return tag.equals(thumbnail.getTag());

protected void imageLoader(ViewHolder holder, String imageUrl) {
    if (!holder.isSameView(imageUrl)) {  // If image is loaded correctly skip else reload and set new image
        imageLoader.displayImage(imageUrl, holder.thumbnail, new SimpleImageLoadingListener() {@
            public void onLoadingFailed(String imageUri, View view, FailReason failReason) {
                view.setTag(failReason.getType().name()); // You can handle errors and avoid repeating requests that return error codes