Android ListView Tutorial 4.6/5 (92%) 13 votes

This tutorial will be demonstrate on how to build simple and customized ListView for android. This article is to understand what is list, adapters, simple list and customizing list view in android.

List is one of the most common UI patterns, which is being used extensively to display the collection of data elements in rows. In android ListView is a view group that displays a list of scrollable items. The list items are automatically inserted to the list using an Adapter that pulls content from a source such as an array.

Understanding Adapter

Adapter is basically bridge between UI components and the data source that fill data into UI Component. Adapter is used to supply the data to like spinner, list view, grid view etc. For example, we can create a list view from xml layout without data, and using adapter we can supply data sets to list view.

If you look at the above images you will certainly get an idea of list view. This kind of customizable list views can be done using an adapter.

Building ListView using ArrayAdapter

This is the simplest way we can create a simple default styled list view from array of elements. To do this there are three things to concentrate,

  1. Find out what data you want to display in list: For our example, I am considered taking a static array of strings. But for complex scenarios it can be a response from server, or data fetched from database.
  2. Declare the list view object in your xml layout: ListView is the user interface element we are using to represent data to user. So in my example, the layout contains a list view. Make sure you provide an appropriate id.
  3. Now finally, feed the list view with the data sets: For this we use adapters. We can always customize our adapter, but for to start let’s make it simple. I am using Array adapter class available in android.
Download Code

Here is how my layout file looks like

<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=".ListActivity" >

<ListView
android:id="@+id/months_list"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>

</LinearLayout>

ListActivity.java

package com.javatechig.droid.ui;

import android.os.Bundle;
import android.app.Activity;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class ListActivity extends Activity {

	// Initialize the array
	String[] monthsArray = { "JAN", "FEB", "MAR", "APR", "MAY", "JUNE", "JULY",
 "AUG", "SEPT", "OCT", "NOV", "DEC" };

	// Declare the UI components
	private ListView monthsListView;

	private ArrayAdapter arrayAdapter;

	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_list);

		// Initialize the UI components
		monthsListView = (ListView) findViewById(R.id.months_list);
		// For this moment, you have ListView where you can display a list.
		// But how can we put this data set to the list?
		// This is where you need an Adapter

		// context - The current context.
		// resource - The resource ID for a layout file containing a layout to use when instantiating views.
		// From the third parameter, you plugged the data set to adapter
		arrayAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, monthsArray);

		// By using setAdapter method, you plugged the ListView with adapter
		monthsListView.setAdapter(arrayAdapter);
	}
}

Output of the above code is

About Javatechig

Javatechig has written 68 post in this blog.

Founder of Javatechig.com love Java, Android, Blackberry and other mobile development stuffs.

 

Tags: , ,