Images are again loaded while scrolling the Listview in android

Question

My images are again getting loaded when I scroll my listview.

Here is my getview method of my adapter.

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

        View itemView = convertView;
//      if(itemView==null){
//      final int x=position;
         Log.e("view Touched..","dsfgvdvgd");
         LayoutInflater inflator = ((Activity) context).getLayoutInflater();
//       LayoutInflater inflator = getLayoutInflater();
         itemView=inflator.inflate(resId, null);
//      }
         // name
        TextView name=(TextView) itemView.findViewById(R.id.userName);
        name.setText(usersSS.get(position).getUsername());


        TextView state=(TextView) itemView.findViewById(R.id.state);
        state.setText(usersSS.get(position).getState());



        //image
        ImageView img = (ImageView)itemView.findViewById(R.id.userimage);
        if(position==3){
        Log.e("image urls",usersSS.get(position).getUserthumb());
        }
        imageLoader.DisplayImage(usersSS.get(position).getUserthumb().replace(" ","%20"), img);

        // rating stars..

        int[] stars = {R.id.star1,R.id.star2,R.id.star3,R.id.star4,R.id.star5};
        if(!usersSS.get(position).getRating().equals(""))
        {
            int i=Integer.parseInt(usersSS.get(position).getRating());
            for(int j=0;j<i;j++)
            {
                ImageView imgv =(ImageView)itemView.findViewById(stars[j]);
                imgv.setBackgroundResource(R.drawable.star_on);
            }
        }


         Log.e("view","view");
        return itemView;

    }

I tried with keeping, if(convertView==null){} but then,wrong images are loaded first and after scrolling correct images are loaded.

Please help me in solving the issue.

Check out this qustion, it's got all the answers you need: http://stackoverflow.com/questions/541966/how-do-i-do-a-lazy-load-of-images-in-listview — npace, Sep 20 '13 at 10:54

Gaurav Vashisth · Answer 1 · 2013-09-20T11:19:46.483

You can use libraries like picasso https://github.com/square/picasso or Universal Image Loader or Volley for image loading. It would be way too easy if you use these libraries.

I am adding example code snippet you can use with picasso.

First of all I would say, Please use view reuse pattern in your getView, along with viewholder.

private static final int IMAGE_HEIGHT = 100;
private static final int IMAGE_WIDTH = 100;
public static class ViewHolder {
    public ImageView imageView;
    public TextView title;
    public TextView subTitle;

}

@Override
public Object getItem(int position) {
    return usersSS.get(position);
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder holder;
    if(null == convertView) {
        convertView = inflater.inflate(R.layout.row_user_data, parent, false);  
        holder = new ViewHolder();
        holder.imageView = (ImageView) convertView.findViewById(R.id.userImage);
        holder.title = (TextView) convertView.findViewById(R.id.userName);
        holder.subTitle = (TextView) convertView.findViewById(R.id.state);          
    } else {
        holder = (ViewHolder) convertView.getTag();
    }
    User user = (User) getItem(position);
    holder.title.setText(user.getUserName());
    holder.subTitle.setText(user.getState);
    if (!TextUtils.isEmpty(user.getUserThumb())) {
        Picasso.with(context).load(user.getUserThumb)
                .error(R.drawable.dummy_image)
                .placeholder(R.drawable.dummyImage)
                .resize(IMAGE_HEIGHT, IMAGE_WIDTH).centerCrop()

                .into(holder.imageView);
    }
    return convertView;
}

Images are again loaded while scrolling the Listview in android

1 Answers1