Lesson 9 List with custom objects and adapter ---- 2

List with custom objects and adapter

Custom Objects

Frequently you’ll have some sort of object model that describes the kinds of data you’re trying to show– in our example, we’re going to have a very simple, immutable class called NewsEntry that encapsulates information about a fictitious news entry. Our use cases include a title, author, date of posting, and an icon to show. For simplicity we’ll assume the icon is a local resource in the APK.

Here is our NewsEntry class:

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051

package com.learnandroid.listviewtutorial.adapter;   import java.util.Date;   /** * Encapsulates information about a news entry */ public final class NewsEntry { private final String title; private final String author; private final Date postDate; private final int icon;   public NewsEntry(final String title, final String author, final Date postDate, final int icon) { this.title = title; this.author = author; this.postDate = postDate; this.icon = icon; }   /** * @return Title of news entry */ public String getTitle() { return title; }   /** * @return Author of news entry */ public String getAuthor() { return author; }   /** * @return Post date of news entry */ public Date getPostDate() { return postDate; }   /** * @return Icon of this news entry */ public int getIcon() { return icon; }   }

view rawNewsEntry.java hosted with ❤ by GitHub

In our previous tutorial, we used an ArrayAdapter that took simple Strings and bound them to a simple TextView layout for each String in the list. Since we’re using more complex objects, such as NewsEntry, we can’t necessarily rely on a toString() to satisfy our complex view. Android actually provides a SimpleAdapter class that could serve our needs, but for the sake of depth we’ll extend and override ArrayAdapter for our purposes.

NewsEntry List Item Layout

We need to define how each item in the list is going to look. We won’t be focusing too much on the layout contents, as we have some excellent tutorials for layouts all by themselves here: Android Layout Tutorial

Here’s the example layout we’re going with:

Lots of Lists 2: News Entry Item Layout

This is the final layouts we came up with (plus two icons to use):

Place the following icons under res/drawable-mdpi/. They should be located at res/drawable-mdpi/news_icon_1.png and res/drawable-mdpi/news_icon_2.png when finished.

News Icon Variety #1

News Icon Variety #2

And place the following layout file under res/layout/news_entry_list_item.xml

12345678910111213141516171819202122232425262728293031323334353637

<?xml version="1.0" encoding="utf-8"?>   <!-- Layout for individual news entries in a list --> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- Icon shown next to the title/subtitle --> <ImageView android:id="@+id/news_entry_icon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:padding="3dp" /> <!-- Title of the news entry --> <TextView android:id="@+id/news_entry_title" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_toRightOf="@id/news_entry_icon" android:layout_alignTop="@id/news_entry_icon" android:layout_margin="5dp" android:textSize="14sp" android:textStyle="bold" /> <!-- Subtitle contains author and date --> <TextView android:id="@+id/news_entry_subtitle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@id/news_entry_title" android:layout_below="@id/news_entry_title" android:textSize="12sp" />   </RelativeLayout>

view rawnews_entry_list_item.xml hosted with ❤ by GitHub

As you can see, we used a RelativeLayout to position our title, icon, and subtitle views. To learn more about RelativeLayouts, check this out: Android Layout Tutorial – RelativeLayouts.

On the next page we’ll look at the implementation of our custom adapter, NewsEntryAdapter.