Load wrong image in ListView using Universal Image Loader Android?

Question

I have a list contains: contentString and list images, it look like:

[{
"contentString": "Image",
"images": [{
    "image": "url"
}]
}, {...}]

Then I try loading it in ListView.

My holder:

class Holder {
    TextView Content;
    ImageView ImageButton;
    ImageLoader imageLoaderPost;
    public Holder(TextView Content, ImageView ImageButton, ImageLoader imageLoader) {            
        this.Content = Content;
        this.ImageButton = ImageButton;
        this.imageLoaderPost = imageLoader;
    }

}

Load View in ListView:

public View getView(final int position, View convertView, ViewGroup parent) {
View v = convertView;

final Holder holder;
if (v == null) {
    v = inflater.inflate(R.layout.activity_row, parent, false);
    TextView Content = (TextView) v.findViewById(R.id.ContentTextView);
    ImageView ImageButton = (ImageView) v.findViewById(R.id.ImageButton);
    ImageLoader imageLoaderPost = ImageLoader.getInstance();
    holder = new Holder(Content, ImageButton, imageLoaderPost);
    v.setTag(holder);
} else {
    holder = (Holder) v.getTag();
}

final HTPost post = postList.get(position);

// post content
holder.postContent.setText(post.getContentString());

//
DisplayImageOptions options = new DisplayImageOptions.Builder()
    .imageScaleType(ImageScaleType.IN_SAMPLE_POWER_OF_2)
    .considerExifParams(true)
    .resetViewBeforeLoading(true)
    .cacheOnDisk(true)
    .imageScaleType(ImageScaleType.EXACTLY)
    .bitmapConfig(Bitmap.Config.RGB_565)
    .build();
// image
if (post.getImages().size() > 0) {

    holder.imageLoaderPost.displayImage(post.getImages().get(0).getImage(), holder.postImageButton, options, new ImageLoadingListener() {@Override
        public void onLoadingStarted(String s, View view) {

        }

        @Override
        public void onLoadingFailed(String s, View view, FailReason failReason) {}

        @Override
        public void onLoadingComplete(String s, View view, Bitmap bitmap) {


        }

        @Override
        public void onLoadingCancelled(String s, View view) {}
    });
} else {
    //holder.imageLoaderPost.cancelDisplayTask(holder.postImageButton);
    log("Wrong image: " + post.getContentString());
}
return v;
}

With rows don't have image, I only load contentString and print: log("Wrong image: " + post.getContentString());

But in ListView, I see a image be loaded with Content. (Row without image but have image in ListView, Image coincides with 1 in all images be loaded before).

I don't know why, maybe cache of ImageLoader?
Any helps, thanks!

Answer 1

You are using ViewHolder so the row in ListView will be reused without recreate repeatedly. Therefore, you will have the image in all rows.

The simple solution is hide ImageView in the rows where you don't want it

    if(your condition){
        ...
        holder.ImageButton.setVisibility(View.VISIBLE);
        ... load your image
        ...
    } else {
        log("Wrong image: " + post.getContentString());

        holder.ImageButton.setVisibility(View.INVISIBLE);  //hide your ImageView or you can load default image
    }

Hope this help