07.24
When writing the Call history part of my Android app for Mobile Vikings I wanted to display the calls and messages in a listview with their number, date/time and cost. Displaying some text values in a ListView isn’t that hard. I could use an ArrayAdapter object that takes an ArrayList of Calls and it would display the toString() method of each call in the ListView. What I wanted to do was display various attributes of each Call object (number, date, cost) in the ListView. Like this.
After some research I found out that the SimpleAdapter class was the way to go. The documentation on the SimpleAdapter class wasn’t very clear to me at first and there wasn’t a working codesample to demo the class so I decided to share my own code.
The SimpleAdapter class uses an ArrayList of Maps to hold the data. Each Map in the list represents the data for one row in the ListView. The mapping between the values in the Map and the TextViews in the layout file is done with two arrays. An array of Strings for the keys that need to be mapped and an array of ints with the id’s of the TextViews the data belongs to.
We’ll start of with the code for the layout file. This file describes how one row in our listview should look. I used a TableLayout because I wanted two columns. In the first column I have a LinearLayout with two TextViews. One for the number display and one for the time. The other column holds one TextView for the cost of the call.
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:stretchColumns="0" android:padding="5dp"> <TableRow android:padding="5dp"> <LinearLayout android:orientation="vertical"> <TextView android:textSize="16sp" android:textStyle="bold" android:id="@+id/callog_detail_sms_number" android:layout_width="fill_parent" android:layout_height="wrap_content"> </TextView> <TextView android:textSize="16sp" android:id="@+id/callog_detail_sms_date" android:layout_width="fill_parent" android:layout_height="wrap_content"> </TextView> </LinearLayout> <TextView android:textSize="16sp" android:id="@+id/callog_detail_sms_price" android:layout_width="wrap_content" android:layout_height="fill_parent"></TextView> </TableRow> </TableLayout>
Next up is the java code I used to convert my List of Calls to the List of Maps and to map the correct values to the corresponding TextViews.
// get messages from service ArrayList<Call> smsMessages = service.getSmsCalls(); // initialize the List of Maps List<Map<String, String>> list = new ArrayList<Map<String, String>>(); // iterate over all messages // create a map for each message // fill the map with data for (Call c: smsMessages) { Map<String, String> map = new HashMap<String, String>(); map.put("number", c.getTo()); map.put("date", DateParser.getTimeString(c.getBegin())); map.put("price", "€ " + c.getPrice()); list.add(map); } // the from array specifies which keys from the map // we want to view in our ListView String[] from = {"number", "date", "price"}; // the to array specifies the TextViews from the xml layout // on which we want to display the values defined in the from array int[] to = {R.id.callog_detail_sms_number, R.id.callog_detail_sms_date, R.id.callog_detail_sms_price}; // get a reference to the ListView ListView lv = (ListView)findViewById(R.id.callog_detail_listview); // create the adapter and assign it to the listview SimpleAdapter adapter = new SimpleAdapter(this.getApplicationContext(), list, R.layout.callog_detail_sms, from, to); lv.setAdapter(adapter);
That’s it. I hope this was helpfull to some of you. Improvements and comments are always welcome.
Hi Steven
Do you have this sample ’s project source code(java & xml).
if YES, could you give me a copy. because i meet some problem to understand Adapter usage.
Thanks a lot.
By the way, my e-mail is:shijintao@gmail.com. Thanks
/Griffin