Android List View

Advertisements

d

Android ListView is a view which groups several items and display them in vertical scrollable list. The list items are automatically inserted to the list using an Adapter that pulls content from a source such as an array or database.

An adapter actually bridges between UI components and the data source that fill data into UI Component. Adapter can be used to supply the data to like spinner, list view, grid view etc.

The ListView and GridView are subclasses of AdapterView and they can be populated by binding them to an Adapter, which retrieves data from an external source and creates a View that represents each data entry.

Android provides several subclasses of Adapter that are useful for retrieving different kinds of data and building views for an AdapterView ( ie. ListView or GridView). The two most common adapters are ArrayAdapter and SimpleCursorAdapter. We will see separate examples for both the adapters.

ListView Attributes

Following are the important attributes specific to GridView:

AttributeDescription
android:idThis is the ID which uniquely identifies the layout.
android:dividerThis is drawable or color to draw between list items. .
android:dividerHeightThis specifies height of the divider. This could be in px, dp, sp, in, or mm.
android:entriesSpecifies the reference to an array resource that will populate the ListView.
android:footerDividersEnabledWhen set to false, the ListView will not draw the divider before each footer view. The default value is true.
android:headerDividersEnabledWhen set to false, the ListView will not draw the divider after each header view. The default value is true.

ArrayAdapter

You can use this adapter when your data source is an array. By default, ArrayAdapter creates a view for each array item by calling toString() on each item and placing the contents in a TextView. Consider you have an array of strings you want to display in a ListView, initialize a new ArrayAdapter using a constructor to specify the layout for each string and the string array:

ArrayAdapter adapter = new ArrayAdapter<String>(this,  
          R.layout.ListView, 
          StringArray);

Here are arguments for this constructor:

  • First argument this is the application context. Most of the case, keep it this.

  • Second argument will be layout defined in XML file and having TextView for each string in the array.

  • Final argument is an array of strings which will be populated in the text view.

Once you have array adaptor created, then simply call setAdapter() on your ListView object as follows:

ListView listView = (ListView) findViewById(R.id.listview);
listView.setAdapter(adapter);

You will define your list view under res/layout directory in an XML file. For our example we are going to using activity_main.xml file.

Example

Following is the example which will take you through simple steps to show how to create your own Android application using ListView. Follow the following steps to modify the Android application we created in Hello World Example chapter:

StepDescription
1You will use Eclipse IDE to create an Android application and name it as HelloWorld under a package com.example.helloworld as explained in the Hello World Example chapter.
2Modify the detault content of res/layout/activity_main.xml file to include ListView content with the self explanatory attributes.
3Define required constants in res/values/strings.xml file.
4Create a Text View file res/layout/activity_listview.xml. This file will have setting to display all the list items. So you can customize its fonts, padding, color etc. using this file.
6Run the application to launch Android emulator and verify the result of the changes done in the aplication.

Following is the content of the modified main activity file src/com.example.helloworld/MainActivity.java. This file can include each of the fundamental lifecycle methods.

package com.example.helloworld;

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

public class MainActivity extends Activity {

   // Array of strings...
    String[] countryArray = {"India", "Pakistan", "USA", "UK"};

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      
      ArrayAdapter adapter = new ArrayAdapter<String>(this, 
      R.layout.activity_listview, countryArray);
      
      ListView listView = (ListView) findViewById(R.id.country_list);
      listView.setAdapter(adapter);
   }
}

Following will be the content of res/layout/activity_main.xml file:

<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/country_list"
   android:layout_width="match_parent"
   android:layout_height="wrap_content" >
   </ListView>
 
</LinearLayout>

Following will be the content of res/values/strings.xml to define two new constants:

<?xml version="1.0" encoding="utf-8"?>
<resources>

   <string name="app_name">HelloWorld</string>
   <string name="action_settings">Settings</string>

</resources>

Following will be the content of res/layout/activity_listview.xml file:

<?xml version="1.0" encoding="utf-8"?>
<!--  Single List Item Design -->
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/label"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:padding="10dip"
        android:textSize="16dip"
        android:textStyle="bold" >
</TextView>

Let's try to run our modified Hello World! application we just modified. I assume you had created your AVD while doing environment setup. To run the app from Eclipse, open one of your project's activity files and click Run Eclipse Run Icon icon from the toolbar. Eclipse installs the app on your AVD and starts it and if everything is fine with your setup and application, it will display following Emulator window:

Android listView Layout

SimpleCursorAdapter

You can use this adapter when your data source is a database Cursor. When using SimpleCursorAdapter, you must specify a layout to use for each row in the Cursor and which columns in the Cursor should be inserted into which views of the layout.

For example, if you want to create a list of people's names and phone numbers, you can perform a query that returns a Cursor containing a row for each person and columns for the names and numbers. You then create a string array specifying which columns from the Cursor you want in the layout for each result and an integer array specifying the corresponding views that each column should be placed:

String[] fromColumns = {ContactsContract.Data.DISPLAY_NAME, 
                        ContactsContract.CommonDataKinds.Phone.NUMBER};
int[] toViews = {R.id.display_name, R.id.phone_number};

When you instantiate the SimpleCursorAdapter, pass the layout to use for each result, the Cursor containing the results, and these two arrays:

SimpleCursorAdapter adapter = new SimpleCursorAdapter(this, 
        R.layout.person_name_and_number, cursor, fromColumns, toViews, 0);
        
ListView listView = getListView();
listView.setAdapter(adapter);

The SimpleCursorAdapter then creates a view for each row in the Cursor using the provided layout by inserting each fromColumns item into the corresponding toViews view.



Advertisements
Advertisements