pro_newbie
pro_newbie

Reputation: 336

Custom ArrayAdapter shows duplicate images after scrolling

I am new to android and by using ArrayAdapter, I am trying to create a listView with title and image. I am getting the images from sqlite databae.(I know, it is not recommended), but so far I am able to create the desired listView.

There are some items in listView, which do not have image and some have images, the problem I am having is when I scroll up and down then my image gets duplicated. The ones that do not have image gets the random image from the list.

I have searched the web and found related threads, but that didn't fix my problem.

My ArrayAdapter code:

public class CustomListViewAdapter extends ArrayAdapter<DataItems> 
{
  Context context;
  LayoutInflater mInflater;

  public CustomListViewAdapter(Context context, int resourceId, List<DataItems> items) 
  {
    super(context, resourceId, items);
    this.context = context;
    mInflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
  }

  /* private view holder class */
  private class ViewHolder 
  {
     ImageView thumdnail;           
     TextView txtTitle;
  } 

  public View getView(int position, View convertView, ViewGroup parent)
  {
    ViewHolder holder = null;
    DataItems rowItem = getItem(position);

    if (convertView == null) 
    {
      holder = new ViewHolder();

      convertView = mInflater.inflate(R.layout.list_item2, null, false);

      holder.thumdnail = (ImageView) convertView.findViewById(R.id.thumbnail2); 
      holder.txtTitle = (TextView) convertView.findViewById(R.id.mytitle2);

      convertView.setTag(holder);
    }
    else
    {
      holder = (ViewHolder) convertView.getTag();
    }


    holder.txtTitle.setText(rowItem.getTitle());

    if(rowItem.getThumbnailImageId() != null)
    {
      // here getImage() is converting byte array to bitmap

      Bitmap b2 = getImage(rowItem.getThumbnailImageId());
      Drawable drawable2 = new BitmapDrawable(b2);
      holder.thumdnail.setBackground(drawable2);
    }

    return convertView;

}

Could you please tell me, what am I doing wrong here?

Upvotes: 0

Views: 991

Answers (2)

Blaze Tama
Blaze Tama

Reputation: 10948

Thanks to njzk2 it seems your problem is we forgot to set the visibility to VISIBLE again in the if statement.

You need to specify what geView will do if there is no image :

if(rowItem.getThumbnailImageId() != null)
        {
            // here getImage() is converting byte array to bitmap

            Bitmap b2 = getImage(rowItem.getThumbnailImageId());
            Drawable drawable2 = new BitmapDrawable(b2);
            holder.thumdnail.setBackground(drawable2);

            holder.thumdnail.setVisibility(View.VISIBLE);
        }
    else
    {
      //hide the image, or do anything you like when theres no image
      holder.thumdnail.setVisibility(View.GONE);
    }

The point is in the else code, so the listview know what to do when there is an image (your if statement) and if there's not (the else statement).

And try to make your holder class static :

private static class ViewHolder

Upvotes: 4

Luciano Rodr&#237;guez
Luciano Rodr&#237;guez

Reputation: 2309

You should hide the ImageView if you don't have the thumbnailID:

if(rowItem.getThumbnailImageId() != null)
    {
        holder.thumdnail.setVisibility(View.VISIBLE);

        Bitmap b2 = getImage(rowItem.getThumbnailImageId());
        Drawable drawable2 = new BitmapDrawable(b2);
        holder.thumdnail.setBackground(drawable2);
    }
else
{
     holder.thumdnail.setVisibility(View.GONE);
}

Upvotes: 1

Related Questions