Creating Lists Using The Android ListActivity

Custom Row elements

As you just saw in the cursor example the list items can be customized. Some of the common customizations are formatting text display, adding icons, and checkboxes. To customize text layout we'll simply create a new layout, but adding custom icons and checkboxes require more work.

Formatting and arranging text

Right click on res/layouts/ select New > android XML file. Set the file name to text_list.xml then select the root element as a LinearLayout and click finish.

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

This nested LinearLayout creates a base to create a list that displays bookmark information. The outer LinearLayout is set to a vertical orientation and has a nested LinearLayout element that stores the top line followed by a TextView containing the URL. The nested LinearLayout contains the top line of the list element that contains the number of visits to the URL and the bookmark title. Now we need to go back and edit the java in TestListActivities.java.

package com.higherpass.android.widgets.test;

import android.app.ListActivity;
import android.database.Cursor;
import android.os.Bundle;
import android.provider.Browser;
import android.widget.SimpleCursorAdapter;

public class TestListActivities extends ListActivity {
    String[] listItems = {"exploring", "android", "list", "activities"};

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        String[] projection = new String[] {Browser.BookmarkColumns._ID, 
                                    Browser.BookmarkColumns.TITLE, 
                                    Browser.BookmarkColumns.URL,
                                    Browser.BookmarkColumns.VISITS};
        String[] displayFields = new String[] {Browser.BookmarkColumns.VISITS,
                                    Browser.BookmarkColumns.TITLE, 
                                    Browser.BookmarkColumns.URL};
        int[] displayViews = new int[] { R.id.bmark_visits,
                                    R.id.bmark_title,
                                    R.id.bmark_url};

        Cursor cur = managedQuery(android.provider.Browser.BOOKMARKS_URI, 
                       projection, null, null, null);

        setListAdapter(new SimpleCursorAdapter(this, 
                        R.layout.text_list, cur, 
                        displayFields, displayViews
        ));
    }
}

There are a few key changes we make to the earlier code. First add the Browser.BookmarkColumns.VISITS to the projection field and adjust the displayFields and displayViews string arrays as shown. This will set the SimpleCursorAdapter to map the data to the new layout. Next adjust the layout that is passed into the SimpleCursorAdapter to the one we just created, R.layout.text_list. Now the list will be displayed with the custom view applied.