Universal Image Loader lags when scrolling ListView

Question

I have a listView which has image items. I'm using UniversalImageLoader to get image from url and set it on an ImageView. I tried to write the code inside another thread but since the imageView was built in the main thread, My app crashed. the problem is When I scroll the listView, loading images slows the scrolling and makes it laggy. this is my getView():

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

    final viewHolder holder;
    if (convertView == null) {
        LayoutInflater mInflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
        if (isGrid)
            convertView = mInflater.inflate(R.layout.main_grid_item, null);
        else
            convertView = mInflater.inflate(R.layout.main_list_item, null);
        holder = new viewHolder();

        holder.ivImage = (ImageView) convertView.findViewById(R.id.ivImage);

        RelativeLayout.LayoutParams ivLPI;
        if (isGrid) {
            ivLPI = new RelativeLayout.LayoutParams(imageSize, imageSize);
            ivLPI.addRule(RelativeLayout.ALIGN_PARENT_TOP, 1);
            ivLPI.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, 1);
            ivLPI.addRule(RelativeLayout.ALIGN_PARENT_LEFT, 1);
        } else {
            ivLPI = new RelativeLayout.LayoutParams(Utils.convertDpToPx(context, 120), Utils.convertDpToPx(context, 120));
            ivLPI.addRule(RelativeLayout.ALIGN_PARENT_TOP, 1);
            ivLPI.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, 1);
        }
        holder.ivImage.setLayoutParams(ivLPI);

        convertView.setTag(holder);

    } else {
        holder = (viewHolder) convertView.getTag();
    }

    DisplayImageOptions defaultOptions = new DisplayImageOptions.Builder()
            .delayBeforeLoading(0)
            .resetViewBeforeLoading(true)
            .cacheInMemory(true)
            .cacheOnDisk(true)
            .bitmapConfig(Bitmap.Config.RGB_565)
            .imageScaleType(ImageScaleType.EXACTLY)
            .build();


    ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(context)
            .denyCacheImageMultipleSizesInMemory()
            .defaultDisplayImageOptions(defaultOptions)
            .diskCacheExtraOptions(480, 320, null)
            .threadPoolSize(10)
            .build();

    ImageLoader.getInstance().init(config);

    final ProgressBar spinner = (ProgressBar) convertView.findViewById(R.id.spinner);

    ImageLoader imageLoader = ImageLoader.getInstance();
    imageLoader.displayImage(data.get(position).getThumbURL(), holder.ivImage, new ImageLoadingListener() {

        @Override
        public void onLoadingStarted(String s, View view) {
            spinner.setVisibility(View.VISIBLE);
        }

        @Override
        public void onLoadingFailed(String s, View view, FailReason failReason) {
            spinner.setVisibility(View.GONE);
        }

        @Override
        public void onLoadingComplete(String s, View view, Bitmap bitmap) {
            spinner.setVisibility(View.GONE);
        }

        @Override
        public void onLoadingCancelled(String s, View view) {

            spinner.setVisibility(View.GONE);
        }
    });
    return convertView;
}

Answer 1

From your code i see that your DisplayImageOptions and ImageLoaderConfiguration is not changing at all than why you creating it every time.
so put that two object and ImageLoader imageLoader = ImageLoader.getInstance(); in onCreate() . It will solve your problem.