Learn About Custom List View Using View and Holder in Android

Introduction

 

This article explains the custom list view using view and holder in Android. Android Studio is used to create the sample.

 

In a simple ListView only one piece of data can be displayed in a row but what will happen when we need to show data in multiple columns of a ListView? For this, we need to create a Custom Adapter to show data in multiple columns of a ListView. In this ListView application, I have shown a company name and company id in two columns. For this I have crated three classes, the first is a CustomListview class where the list view is created and that stores the data into it using the CustomAdapter class. Second  I created a List model class that stores data and returns data using methods. In a Custom Adapter class, I get the arraylist by the constructor of the CustomAdapter class.

Now after taking an ArrayList i Have created a View class to get the layout and a holder that holds the views of that layout. Get the object of the arraylist into the object of the Listmodel and set the values into the textview using the setText() method.

 

Step 1

 

The following describes how to create the project.

 

Step 2

 

Create an XML file with the following in it:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <ListView
        android:id="@+id/listView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

Step 3

 

Create another XML file with the following in it:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="?android:attr/listPreferredItemHeight"
   >

     <TextView
        android:id="@+id/text1"
         android:textColor="#0000ff"
        android:layout_width="wrap_content"
        android:layout_height="26dip"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:textStyle="bold"
         android:text="text1"/>

    <TextView
        android:textColor="#0000ff"
        android:layout_marginLeft="300dp"
        android:text="text2"
        android:id="@+id/text2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"/>
</RelativeLayout>

Step 4

 

Create a Java class file with the following in it:

package com.listactivtyapplication;

import java.util.ArrayList;

import android.app.Activity;
import android.app.ListActivity;
import android.content.res.Resources;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.Toast;

public class CustomListViewAndroidExample extends Activity {

    String[] arrayString = new String[]{"IBM", "TCS", "MCN", "WIPRO", "INFOSYS", "ACCENTURE"};
    CustomListViewAndroidExample customListViewAndroidExample = this;
    Listmodel list;
    ListView listView;
    ArrayList<Listmodel> arrayList = new ArrayList<Listmodel>();
    CustomAdapter adapter;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.customlistviewandroidexample);
        listView = (ListView) findViewById(R.id.listView);
        setData();
        Resources resources = getResources();
        adapter = new CustomAdapter(customListViewAndroidExample, arrayList, resources);
        listView.setAdapter(adapter);

        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {


                Toast.makeText(getApplicationContext(), list.getCompanyname() + "\n" + list.getid(), Toast.LENGTH_LONG).show();
            }
        });

    }

    public void setData() {
        for (int i = 0; i <= arrayString.length - 1; i++) {
            list = new Listmodel();
            list.setCompanyName("companyname :" + arrayString[i]);
            list.setName("id :" + i);
            arrayList.add(list);
        }
    }
}

Step 5

 

Create another Java class file with the following in it:

package com.listactivtyapplication;
import java.util.ArrayList;
import android.app.Activity;
import android.content.Context;
import android.content.res.Resources;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
public class CustomAdapter extends BaseAdapter
{
 Activity activity;
 LayoutInflater inflater;
 ArrayList arrayList;
 Resources resource;
 Listmodel tempValues;
 CustomAdapter(Activity activty, ArrayList arrayList, Resources resource)
 {
  this.activity = activty;
  this.arrayList = arrayList;
  this.resource = resource;
  inflater = (LayoutInflater) activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 }
 @Override
 public int getCount()
 {
  if (arrayList.size() <= 0)
   return 1;
  return arrayList.size();
 }
 @Override
 public Object getItem(int position)
 {
  return position;
 }
 @Override
 public long getItemId(int position)
 {
  return position;
 }
 public static class ViewHolder
 {
  public TextView text;
  public TextView text1;
  public TextView text2;
 }
 public View getView(int position, View convertView, ViewGroup parent)
 {
  View vi = convertView;
  ViewHolder holder;
  if (convertView == null)
  {
   vi = inflater.inflate(R.layout.row, null);
   holder = new ViewHolder();
   holder.text1 = (TextView) vi.findViewById(R.id.text1);
   holder.text2 = (TextView) vi.findViewById(R.id.text2);
   vi.setTag(holder);
  }
  else
   holder = (ViewHolder) vi.getTag();
  if (arrayList.size() <= 0)
  {
   holder.text.setText("No Data");
  }
  else
  {
   tempValues = null;
   tempValues = (Listmodel) arrayList.get(position);
   holder.text1.setText(tempValues.getCompanyname());
   holder.text2.setText(tempValues.getid());
  }
  return vi;
 }
}

Step 6

 

Create a Java class file with the following in it:

package com.listactivtyapplication;

public class Listmodel
{
    private String companyname;
    private String  id;
    private String url;

    public void setCompanyName(String companyname) {
        this.companyname = companyname;
    }

    public void setName(String id)
    {
        this.id=id;
    }
  public String getCompanyname()
  {
      return companyname;
  }

    public String getid()
    {
        return id;
    }
}

Step 7

 

When you run your application: