ListView in Android

In this tutorial, we will learn about ListView in Android. ListView is one of the most commonly used widgets. We normally see ListView in different Android Apps, for example, contact list. Here, we will learn how we can create a simple list in Android and how we can create a custom ListView in Android.

First of all we will add ListView Widget in XML layout file. Check this code.

XML Code:

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

To add listView in Activity we need an adapter which will help us to merge data and view together in ListView. We can provide data to list in the format of array or list. Here we will add simple ArrayAdapter. Check this Java code.

Java Code:

public class MainActivity extends AppCompatActivity {

    String colors[]={"Red","Green","Blue"};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final ListView listView=findViewById(R.id.listView);

        ArrayAdapter<String> arrayAdapter=new ArrayAdapter<>(getApplicationContext(),android.R.layout.simple_list_item_1,colors);

        listView.setAdapter(arrayAdapter);
    }
}

Here is output after writing all this code.

Custom ListView in Android:

To make a custom ListView in android first of all we have to create a layout for single item of list and then we have to create a custom adapter to create listview. Here you have to crate new layout file. Here I just create new layout file and named it as list_item_layout Check this code to create a custom list item.

List Item XML Code:

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

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="18dp"
        android:textColor="@color/colorPrimaryDark"
        android:id="@+id/text1"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14dp"
        android:id="@+id/text2"/>

</LinearLayout>

After creating this layout file we will create custom adpater to add data in this custom list view. To create a custom adapter just add a new java class in your android project and inherit BaseAdapter class in this class. BaseAdapter is an abstract class it mean you have to override all the abstract methods of this class into user class. Here i will create new class called MyListAdapter to create a custom adapter check this code

Custom Adapter Java Code:

public class MyListAdpater extends BaseAdapter {

    String array1[]={"Red","Blue","Green"};
    String array2[]={"Rose is Red","Sky is Blue","Grass is Green"};
    LayoutInflater layoutInflater;
    public MyListAdpater(Context context){
        layoutInflater= (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    }

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

    @Override
    public Object getItem(int i) {
        return i;
    }

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

    @Override
    public View getView(int i, View view, ViewGroup viewGroup) {
        View v=layoutInflater.inflate(R.layout.list_item_layout,null,false);
        TextView text1=v.findViewById(R.id.text1);
        TextView text2=v.findViewById(R.id.text2);
        text1.setText(array1[i]);
        text2.setText(array2[i]);
        return v;
    }
}

Here our custom list item design is ready and our adapter is also ready. Now we will change the adapter of our listview from ArrayAdapter to MyListAdapter in MainActivity.

Main Activity Java Code:

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final ListView listView=findViewById(R.id.listView);

        MyListAdpater myListAdpater=new MyListAdpater(getApplicationContext());

        listView.setAdapter(myListAdpater);
    }
}

check this Output after adding CustomAdapter to our ListView.

Spread the love
Scroll to Top
×