List view with title, image and text?

Question

I need to make a list view with an image on left, a title floated right of that image and a description under that. I have checked out the list view in the docs but i cannot seem to find an example for this. I have a tab view as defined in XML (as per android example tabs1) with a list view as the first tab content. However i want to add the content via a RSS newsfeed to the listview in code.

I was thinking of using a webview using an html injection string but how would i insert images from the drawable folder. (these images are just a "news icon" stored locally, not an image from the internet)

Sorry if it is a bit of a nooby question, but any help appreciated :)

Answer 1

I suppose that the structure you are describing refers to the content of the ListView items. You can achieve this by defining a layout for the individual item. The code below has worked for me in a similar situation:

<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:padding="6dip" android:layout_height="?android:attr/listPreferredItemHeight">
    <ImageView
        android:id="@+id/result_icon"        
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentBottom="true"
        android:layout_marginRight="6dip"        
        android:src="@drawable/image1"/>
    <TextView
        android:id="@+id/result_name"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"        
        android:layout_toRightOf="@id/result_icon"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"        
        android:layout_alignWithParentIfMissing="true"                
        android:gravity="center_vertical"
        android:text="Title" />
    <TextView  
        android:id="@+id/result_second_line"
        android:layout_width="fill_parent"
        android:layout_height="26dip"      
        android:layout_toRightOf="@id/result_icon"
        android:layout_below="@id/result_name"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"        
        android:singleLine="true"
        android:ellipsize="marquee"
        android:text="Second line" />
</RelativeLayout>

You then need to extend a BaseAdapter to use with your ListActivity. You will need to inflate the layout and populate it with data from the RSS feed.

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    Result result = this.results.get(position);


    LayoutInflater inflater = (LayoutInflater) context.getSystemService(
                                        Context.LAYOUT_INFLATER_SERVICE);
    RelativeLayout view = (RelativeLayout) 
            inflater.inflate(R.layout.result_item, null, false);

    ImageView image = (ImageView) view.findViewById(R.id.result_icon);
    image.setImageResource(result.imageResource);

    TextView name = (TextView) view.findViewById(R.id.result_name);
    name.setText(result.location);

    TextView secondLine = (TextView) view.findViewById(R.id.result_second_line);
    secondLine.setText(result.shortDescription);

    return view;
}

Answer 2

You might also check out this page here for a very nice layout android-layout-tricks-1