Creating ViewHolders for ListViews with different item layouts

ListView has a built in type management system. In your adapter, you have several types of items, each with their own view and layout. By overriding getItemViewType to return the data type of a given position, ListView is garunteed to pass in the correct convertview for that type of data. Then, in your getView method simply check the datatype and use a switch statement to handle each type differently.

Each Layout type should have its own viewholder for naming clarity and ease of maintainence. Name the ViewHolders something related to each data type to keep everything straight.

Trying to overlap everything into one ViewHolder is just not worth the effort.

EditExample

@Override public View getView(int position, View convertView, ViewGroup parent) {     int viewType = this.getItemViewType(position);    switch(viewType)    {       case TYPE1:        Type1Holder holder1;          View v = convertView;          if (v == null) {              LayoutInflater vi = (LayoutInflater)getContext().getSystemService     (Context.LAYOUT_INFLATER_SERVICE);              v = vi.inflate(R.layout.layout_mylistlist_item_type_1, parent, false);              holder1 = new Type1Holder ();              holder1.text = (TextView) v.findViewById(R.id.mylist_itemname);              v.setTag(holder1);          }          else {              holder1 = (Type1Holder)v.getTag();          }          MyListItem myItem = m_items.get(position);          // set up the list item          if (myItem != null) {              // set item text              if (holder1.text != null) {                  holder1.text.setText(myItem.getItemName());              }          }          // return the created view          return v;      case TYPE2:            Type2Holder holder2;          View v = convertView;          if (v == null) {              LayoutInflater vi = (LayoutInflater)getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);              v = vi.inflate(R.layout.layout_mylistlist_item_type_2, parent, false);              holder2 = new Type2Holder ();              holder2.text = (TextView) v.findViewById(R.id.mylist_itemname);              holder2.icon = (ImageView) v.findViewById(R.id.mylist_itemicon);              v.setTag(holder1);          }          else {              holder2 = (Type2Holder)v.getTag();          }          MyListItem myItem = m_items.get(position);          // set up the list item          if (myItem != null) {              // set item text              if (holder2.text != null) {                  holder2.text.setText(myItem.getItemName());              }              if(holder2.icon != null)                 holder2.icon.setDrawable(R.drawable.icon1);         }          // return the created view          return v;        default:           //Throw exception, unknown data type    }} 

Another example.

public class CardArrayAdapter extends ArrayAdapter {

public CardArrayAdapter(Context context) {    super(context, R.layout.adapter_card);}@Overridepublic View getView(int position, View view, ViewGroup parent) {    final Card card = getItem(position);    ViewHolder holder;    //if (view != null) {        //holder = (ViewHolder) view.getTag();    //} else {    Log.d("card.important?", card.name + " = " + Boolean.toString(card.important));    if(card.important) {        view = LayoutInflater.from(getContext()).inflate(R.layout.adapter_card_important, parent, false);    }else {        view = LayoutInflater.from(getContext()).inflate(R.layout.adapter_card, parent, false);    }    holder = new ViewHolder(view);    view.setTag(holder);    //}    // IMG    Picasso.with(getContext())            .load(card.logo)            .placeholder(R.drawable.ic_phonebook)            .error(R.drawable.ic_phonebook)            .fit()            .centerCrop()            .transform(new CircleTransform())            .into(holder.logo);    holder.name.setText(card.name);    if(card.important) {        holder.category.setVisibility(View.VISIBLE);        if (card.category.equals("airline")) {            card.category = "airlines";        }        int id = getContext().getResources().getIdentifier(card.category, "string", getContext().getPackageName());        holder.category.setText(getContext().getResources().getString(id));    }else {        holder.category.setVisibility(View.GONE);    }    holder.tagline.setText(card.tagline);    holder.favorite.setChecked(card.favorite);    holder.favorite.setOnClickListener(new View.OnClickListener() {        @Override        public void onClick(View v) {            card.favorite = ((CheckBox) v).isChecked();            card.save();        }    });    return view;}static class ViewHolder {    @InjectView(R.id.logo) ImageView logo;    @InjectView(R.id.name) TextView name;    @InjectView(R.id.category) TextView category;    @InjectView(R.id.tagline) TextView tagline;    @InjectView(R.id.favorite) CheckBox favorite;    public ViewHolder(View view) {        ButterKnife.inject(this, view);    }}

}

Using view types is not the simplest way. Sometimes it's better not to use ViewType, but implement a class hierarchy which will do all the things.

Okay, we have a task to show a furniture items in the list - chairs, beds and so on. First implement the object model:

public abstract class FurnitureBase  {    @LayoutRes    abstract public int getLayoutFileResource();    abstract public HolderFurnitureBase getHolder(View convertView);}public class FurnitureChair extends FurnitureBase  {    public double price;    public Material material;    ...    public FurnitureChair(double price, Material material) {        ...    }    @Override    public int getLayoutFileResource() {        return R.layout.item_furniture_chair;    }    @Override    public HolderFurnitureBase getHolder(View convertView) {        return new HolderFurnitureChair(convertView);    }}public class FurnitureBed extends FurnitureBase  {    public double price;    public BedSize size;    ...    public FurnitureBed(double price, BedSize size) {        ...    }    @Override    public int getLayoutFileResource() {        return R.layout.item_furniture_bed;    }    @Override    public HolderFurnitureBase getHolder(View convertView) {        return new HolderFurnitureBed(convertView);    }}

Next, create holders:

public abstract class HolderFurnitureBase{    public HolderFurnitureBase(View convertView) { };    public abstract void renderItem(FurnitureBase item);}public class HolderFurnitureChair extends HolderFurnitureBase{    private final ImageViewAccent mIconAction;    private final TextViewPrimaryDark mPrice;    ...    public HolderFurnitureChair(View convertView)    {        // just init views        super(convertView);        this.mIconAction = convertView.findViewById(R.id.item_furniture_chair_icon_action;        this.mPrice = convertView.findViewById(R.id.item_furniture_chair_text_price);    }    public void renderItem(FurnitureBase item)    {        FurnitureChair chair = (FurnitureChair ) item;        mIconAction.setImageResource(chair.getProductTypeIcon());        mPrice.setText(Utils.Formatter.formatMoney(chair.price, chair.priceCurrency));    }}public class HolderFurnitureBed extends HolderFurnitureBase{    private final TextView mSize;    private final TextViewPrimaryDark mPrice;    ...    public HolderFurnitureBed(View convertView)    {        // just init views        super(convertView);        this.mSize = convertView.findViewById(R.id.item_furniture_bed_text_size;        this.mPrice = convertView.findViewById(R.id.item_furniture_bed_text_price);    }    public void renderItem(FurnitureBase item)    {        FurnitureBed bed = (FurnitureBed) item;        mSize.setText(bed.getSizeText());        mPrice.setText(Utils.Formatter.formatMoney(bed.getPrice(), bed.getPriceCurrency()));    }}

And gather all the magic in the adapter:

public final class AdapterFurniture extends ArrayAdapter<FurnitureBase>{    public AdapterFurniture(Context context, List<FurnitureBase> items) {        super(context, R.layout.item_furniture_bed, items);    }    @NonNull    @Override    public View getView(final int position, @Nullable View convertView, @NonNull ViewGroup parent)    {        FurnitureBase item = getItem(position);        HolderFurnitureBase holder;        if (convertView == null) {            convertView = LayoutInflater.from(getContext()).inflate(item.getLayoutFileResource(), parent, false);            holder = item.getHolder(convertView);        }        else {            holder = (HolderFurnitureBase) convertView.getTag();        }        holder.renderItem(getItem(position));        convertView.setTag(holder);        return convertView;    }}

That's all. No need to count view types, no need to change adapter when a sofa added, and an armchair, and more and more - just extend the base class for the new item and holder base class for the new holder, and the app is ready for testers to enjoy :)