How To Display A Two Column ListView In Android?

October 24, 2022 Post a Comment

I have an android application that shows a grid view that shows: 1 2 3 4 GridView gridview=(GridView)findViewById(R.id.GridView_test); DataBaseHelper dbhelper=new DataBaseHelper(th

Solution 1:

Does it have to be a grid view? Will a ListView work?

I wrote a ListView and ListActivity that displays two items in each row. I started with the SDK supplied simple_list_item_2.xml layout that lists two items per row but places one on top of the other (two lines) with the second line using a smaller font. What I wanted was both items on the same line, one to the right and one to the left.

First I copied the simple_list_item_2.xml into my project's res/layout directory under a new name and changed the property android:mode="twoLine" to "oneLine" while still keeping the view element name as "TwoLineListItem". I then replaced the two inner elements with ones that did what I wanted.

In the code to initialize the list, I created a MatrixCursor and filled it with the desired data. To support two items, each row in the MatrixCursor requires three columns, one being a primary key, "_id", and the other two columns being the items that I wanted to be displayed. I was then able to use a SimpleCursorAdapter to fill in and control the ListView.

My Layout XML File:

 <?xml version="1.0" encoding="utf-8"?>
  <TwoLineListItem
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:paddingTop="2dip"
     android:paddingBottom="2dip"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:minHeight="?android:attr/listPreferredItemHeight"
     android:mode="oneLine"
  >
<TextView
    android:id="@android:id/text1"
    android:gravity="left"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="6dip"
    android:layout_marginTop="6dip"
    android:textAppearance="?android:attr/textAppearanceLarge"
/>
<TextView
    android:id="@android:id/text2"
    android:gravity="right"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="6dip"
    android:layout_marginTop="6dip"
    android:layout_marginRight="6dip"
    android:layout_toRightOf="@android:id/text1"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:textColor="@color/MainFontColor"
/>
</TwoLineListItem>

Note that I used "left" and "right" android:gravity values to make the left side item left justified and the right side item right justified. You will need different gravity values for your layout plus you will need properties to control the size of the left side item that I did not need.

The method in my ListActivity class that initialized the ListView:

private void initListView()
{
    final String   AuthorName    = "Author: ";
    final String   CopyrightName = "CopyRight: ";
    final String   PriceName     = "Price: ";

    final String[] matrix  = { "_id", "name", "value" };
    final String[] columns = { "name", "value" };
    final int[]    layouts = { android.R.id.text1, android.R.id.text2 };

    MatrixCursor  cursor = new MatrixCursor(matrix);

    DecimalFormat formatter = new DecimalFormat("##,##0.00");

    cursor.addRow(new Object[] { key++, AuthorName, mAuthor });
    cursor.addRow(new Object[] { key++, CopyrightName, mCopyright });
    cursor.addRow(new Object[] { key++, PriceName,
            "$" + formatter.format(mPrice) });

    SimpleCursorAdapter data =
        new SimpleCursorAdapter(this,
                R.layout.viewlist_two_items,
                cursor,
                columns,
                layouts);

    setListAdapter( data );

}   // end of initListView()

The parameter to the MatrixCursor constructor is an array of strings that define the order and the names of the columns in the cursor. Important: Make sure to add an "_id" column, without it the MatrixColumn will throw an exception and fail to work!

The three variables, mAuthor, mCopyright and mPrice, are three data members in my ListAdaptor class and they are initialized elsewhere. In my actual code, mAuthor is actually built in this method from a list of author names. The author names are concatenated into a single string using "\n" as separators between the names. This causes the multiple author names to appear on different lines in the same TextView.

The SimpleCursorAdapter ctor parameters are the ID of the View to use for each List row, the cursor containing the data, an array of strings where each element is the name of the column from the cursor (in the order to get them) and a corresponding array of View IDs for the View to use for each item in the List row.

Solution 2:

If you can't find an existing adapter that has those properties, you can create your own custom adapter and have it map to your view.

The Hello, GridView tutorial shows how to do this.

Solution 3:

JRL is right, you should write your own custom adapter which will let you control what will be displayed in each row. You might find this helpful. A more advanced example can be found here http://developerlife.com/tutorials/?p=327.

If you don't want/have to use a list a TableLayout could display your data as well. But that would be the manual approach since you'd have to fill each cell.

Best of success.

Solution 4:

Why not create a class, whose toString() returns str(id) + " | " + personName, and use it as a template class instead of the String object?

Solution 5:

You can simply add this in your XML android:numColumns="2"

Newest Android Info