Using ViewHolder With ListView

Question

I am using ListView to List text and images but I want to use ViewHolder to make the scrolling more smooth I have tried but can't quite get it right how must I modify the code

The way I have tried some of my images doesn't show up

@Override
public int getCount() {
    return text1.length;
}

@Override
public Object getItem(int position) {
    return text1[position];
}

@Override
public long getItemId(int position) {
    return 0;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    LayoutInflater infla=getActivity().getLayoutInflater();

    View v = infla.inflate(R.layout.list_view_layout, null);

    TextView tv1 = (TextView) v.findViewById(R.id.textView1);
    ImageView iv1 = (ImageView) v.findViewById(R.id.imageView1);
    TextView tv2 = (TextView) v.findViewById(R.id.textView2);
    ImageView iv2 = (ImageView) v.findViewById(R.id.imageView2);
    TextView tv3 = (TextView) v.findViewById(R.id.textView3);
    ImageView iv3 = (ImageView) v.findViewById(R.id.imageView3);
    TextView tv4 = (TextView) v.findViewById(R.id.textView4);
    ImageView iv4 = (ImageView) v.findViewById(R.id.imageView4);
    TextView tv5 = (TextView) v.findViewById(R.id.textView5);
    ImageView iv5 = (ImageView) v.findViewById(R.id.imageView5);
    TextView tv6 = (TextView) v.findViewById(R.id.textView6);
    ImageView iv6 = (ImageView) v.findViewById(R.id.imageView6);
    TextView tv7 = (TextView) v.findViewById(R.id.textView7);
    ImageView iv7 = (ImageView) v.findViewById(R.id.imageView7);

    tv1.setText(text1[position]);
    iv1.setImageResource(text2[position]);
    tv2.setText(text3[position]);
    iv2.setImageResource(text4[position]);
    tv3.setText(text5[position]);
    iv3.setImageResource(text6[position]);
    tv4.setText(text7[position]);
    iv4.setImageResource(text8[position]);
    tv5.setText(text9[position]);
    iv5.setImageResource(text10[position]);
    tv6.setText(text11[position]);
    iv6.setImageResource(text12[position]);
    tv7.setText(text13[position]);
    iv7.setImageResource(text14[position]);

    if(text2[position]==R.drawable.ic_star){
        iv1.setVisibility(View.GONE);
    }if(text3[position].matches("")) {
        tv2.setVisibility(View.GONE);
    }if(text4[position]==R.drawable.ic_star){
        iv2.setVisibility(View.GONE);
    }if(text5[position].matches("")) {
        tv3.setVisibility(View.GONE);
    }if(text6[position]==R.drawable.ic_star){
        iv3.setVisibility(View.GONE);
    }if(text7[position].matches("")){
        tv4.setVisibility(View.GONE);
    }if(text8[position]==R.drawable.ic_star){
        iv4.setVisibility(View.GONE);
    }if(text9[position].matches("")){
        tv5.setVisibility(View.GONE);
    }if(text10[position]==R.drawable.ic_star){
        iv5.setVisibility(View.GONE);
    }if(text11[position].matches("")){
        tv6.setVisibility(View.GONE);
    }if(text12[position]==R.drawable.ic_star){
        iv6.setVisibility(View.GONE);
    }if(text13[position].matches("")){
        tv7.setVisibility(View.GONE);
    }if(text14[position]==R.drawable.ic_star){
        iv7.setVisibility(View.GONE);
    }

    return v;
}

Answer 1

Tricks:

@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
if( convertView == null ){
    convertView = LayoutInflater.from(getActivity()).inflate(R.layout.list_view_layout, null);
    holder = new ViewHolder();
    holder.tv=(TextView) convertView.findViewById(R.id.textView);
    holder.iv=(ImageView) convertView.findViewById(R.id.imageView);
    ...
    convertView.setTag(holder);
}else {
    holder = (ViewHolder)convertView.getTag();
}

holder.tv.setText(text1[position]);
holder.iv.setImageResource(text2[position]);
...
//handle with your widgets cached in ViewHolder
return convertView;

}

And ViewHolder is here:

public class ViewHolder{
    TextView tv;
    ImageView iv;
}

Answer 2

-here is the mmodified adapter to make the scroll more smooth using the viewholder pattern to reuse the item instead of create new one each time you scroll.

/**
 * Created by Ziad on 4/22/2015.
 */
public class Adapter extends BaseAdapter {


    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return text1.length;
    }

    @Override
    public Object getItem(int position) {
        // TODO Auto-generated method stub
        return text1[position];
    }

    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return 0;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub




        ViewdHolder holder=null;

        if (convertView == null) {

            LayoutInflater infla=getActivity().getLayoutInflater();


            View v = infla.inflate(R.layout.list_view_layout, null);

            holder = new viewdHolder();

            holder.tv1= (TextView) v.findViewById(R.id.textView1);
            holder.iv1 = (ImageView) v.findViewById(R.id.imageView1);
            holder.tv2 =(TextView)  v.findViewById(R.id.textView2);
            holder.iv2= (ImageView) v.findViewById(R.id.imageView2);
            holder.tv3 = (TextView) v.findViewById(R.id.textView3);
            holder.iv3 = (ImageView) v.findViewById(R.id.imageView3);
            holder.tv4 = (TextView) v.findViewById(R.id.textView4);
            holder.iv4  = (ImageView) v.findViewById(R.id.imageView4);
            holder.tv5= (TextView) v.findViewById(R.id.textView5);
            holder.iv5  = (ImageView) v.findViewById(R.id.imageView5);
            holder.tv6 = (TextView) v.findViewById(R.id.textView6);
            holder.iv6 = (ImageView) v.findViewById(R.id.imageView6);
            holder.tv7 = (TextView) v.findViewById(R.id.textView7);
            holder.iv7 = (ImageView) v.findViewById(R.id.imageView7);

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

        }




        holder.tv1.setText(text1[position]);
        holder.iv1.setImageResource(text2[position]);
        holder.tv2.setText(text3[position]);
        holder.iv2.setImageResource(text4[position]);
        holder.tv3.setText(text5[position]);
        holder.iv3.setImageResource(text6[position]);
        holder.tv4.setText(text7[position]);
        holder.iv4.setImageResource(text8[position]);
        holder.tv5.setText(text9[position]);
        holder.iv5.setImageResource(text10[position]);
        holder.tv6.setText(text11[position]);
        holder.iv6.setImageResource(text12[position]);
        holder.tv7.setText(text13[position]);
        holder.iv7.setImageResource(text14[position]);



        if(text2[position]==R.drawable.ic_star){
            holder.iv1.setVisibility(View.GONE);
        }
        if(text3[position].matches("")) {
            holder.tv2.setVisibility(View.GONE);
        }
        if(text4[position]==R.drawable.ic_star){
            holder.iv2.setVisibility(View.GONE);
        }
        if(text5[position].matches("")) {
            holder.tv3.setVisibility(View.GONE);
        }
        if(text6[position]==R.drawable.ic_star){
            holder.iv3.setVisibility(View.GONE);
        }
        if(text7[position].matches("")){
            holder.tv4.setVisibility(View.GONE);
        }
        if(text8[position]==R.drawable.ic_star){
            holder.iv4.setVisibility(View.GONE);
        }
        if(text9[position].matches("")){
            holder.tv5.setVisibility(View.GONE);
        }
        if(text10[position]==R.drawable.ic_star){
            holder.iv5.setVisibility(View.GONE);
        }
        if(text11[position].matches("")){
            holder.tv6.setVisibility(View.GONE);
        }
        if(text12[position]==R.drawable.ic_star){
            holder.iv6.setVisibility(View.GONE);
        }
        if(text13[position].matches("")){
            holder.tv7.setVisibility(View.GONE);
        }
        if(text14[position]==R.drawable.ic_star){
            holder.iv7.setVisibility(View.GONE);
        }




        return v;
    }


    class ViewdHolder {




        TextView tv1;
        ImageView iv1 ;
        TextView tv2 ;
        ImageView iv2;
        TextView tv3 ;
        ImageView iv3 ;
        TextView tv4 ;
        ImageView iv4 ;
        TextView tv5 ;
        ImageView iv5 ;
        TextView tv6 ;
        ImageView iv6 ;
        TextView tv7 ;
        ImageView iv7 ;


    }



}

Answer 3

The Viewholder pattern is used to cache the Views of the list item in a holder class so you don't have to call inflate view or findViewById() for every list item in the ListView. By making a class where you can hold keep a reference to all the ChildViews in the list item. Usually this is a inner static class.

The View convertView, parameter in the getView() method is the view that is cached by the Android system already. So you start with an if statement where you inflate a list item if convertView is null. You also set all the childview references on the viewholder there. Then you add the instance of the viewholder class as a tag to the convertView with setTag(). In the else part of the if statement you just get the viewholder from the convertView with getTag(). No you have the viewHolder and can actually update the listview item with new data.

I hope this explains what you need to if not here are some links to some better rescources then my explaination.

• Vogella
• Hold View Objects in a View Holder
• Android ViewHolder Pattern Example

Answer 4

Your need to make use of the convertView sent across in getView() method for optimizing working. Read my blog from properly optimizing the ListView.

Answer 5

First of all you need a static ViewHolder Class that holds your view in your adapter.

more like this one:

static class ViewHolder {
public TextView text;
public ImageView image;
}

And that viewholder will be used as a holder of view where you initialized its view in the getView method and set it as a tag so you can recycle it later for other item in the list.

You can follow this link to apply the viewholder pattern of listview