Android List View–Part 1 Basics

List views are an important part of many android applications because of a number of reasons. Most importantly, is the ability to display large number of data pieces, in limited space provided by a mobile device like an android phone.

In this tutorial, we will be looking into the basics of Android List views. I will also provide a link to completed project at the end of this post.

Overview of steps to make a ListView work

1. Declare the data source. This can be for example, a String array, ArrayList, Database Cursor..etc.
2. Declare and instantiate an adapter.
   • As part of instantiation, link the adapter to data source.
   • Specify the UI resource for each line of ListView.
3. Attach the adapter to ListView User Interface
4. Perform data modification operations on the underlying data source.
5. Notify the adapter of any data change. This will result in the ListView being updated with latest data.

 

2. Declare and Instantiate an Adapter

The first step in making a ListView work is to instantiate an adapter. In this post (Part 1), I am keeping things pretty simple. We will look into complex List views (eg: a ListView with Images, text..etc) in Part 2.

If you look at the source code, the line of code which initialize the adapter is as follows:

//Initialize array adapter to be attached with list
adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1,arrData);

Here, we are using an ArrayAdapter object, as the adapter, because we are working with an ArrayList Object. (look at data type of arrData).

• The first parameter(this) we pass is the context.
• The second parameter (android.R.layout.simple_list_item_1) is a view/UI resource that is packaged with Android. This is simply a textView. For now, we will be using this. But, in part 2, we will be using our own view/UI to define how each item in the list view looks.
• The third parameter (arrData) is the ArrayList object. This is where all our data is stored, for the sample application. More often than not, we will be using database cursors with ListViews. If this is the case for you, then use CursorAdapter instead of ArrayAdapter.

 

3. Attach the adapter to ListView User Interface Object

Once we instantiate the adapter, and link it to our data source, it is time to link the ListView UI object to the adapter. To do this, first we will have to get a reference to the UI object within our application. Following line of code does exactly that.

ListView     lstData = (ListView) findViewById(R.id.lstData);

The object lstData refers to the UI element that we added to main.xml (refer to the code). Once we have a reference to the UI element, following line of code attaches the adapter to the UI.

//Attach the adapter to list view.
lstData.setAdapter(adapter);

This completes all the steps needed to make the ListView work with a set of data.

4. Perform Data modification on underlying data source

However, there still is an issue of data being modified by the application. If/When the underlying data is modified, we have to let the adapter know that there is a change. Unless we do this, the changes will not be reflected in the UI.

Probably you are thinking “Why should I do this notification when data is changed? Cant android just keep track of the data, and detect the changes?”. I will let you ponder on that, and do leave your thoughts as comments.

 

5. Notify the adapter of any data change. This will result in the ListView being updated with latest data.

One important point to note here is that, we are notifying the adapter, that the data has changed. We are not directly communicating with the LIstView UI object. Once the adapter knows about data change, it is then responsible for modification of UI. More about this in Part 2, which will be about custom adapters, and more complex ListView.

Following line of code lets the adapter know that underlying data has changed

adapter.notifyDataSetChanged();

That’s it for simple ListView documentation. We will talk more about ListViews in part 2.

 

References

Base Adapter
http://developer.android.com/reference/android/widget/BaseAdapter.html

 

Source Code

https://github.com/gopalnair/SimpleListView/tree/master/SimpleListView