Custom ListView Item Graphical Layout Android

Question

Please forgive my ignorance, but this is my 3rd day with Android, and I've looked at tutorials, and they all seem to focus on the xml declaration of listview item UI. My question is this, I'd like to be able to see the custom listview item UI in the designer "Graphical Layout" in Eclipse. However, it displays it just like it does any other view in Android, ie. with the title and status bar at the top and taking up the entire screen. What I'd like to see is just the listview item that I'm designing ie. just 50dp tall and filled width. Is there a way to do this?

Answer 1

I believe what you are looking for is a custom adapter. What you are seeing is just the listview item, what you are looking for is the custom layout. Have a look at this tutorial, specifically the part on designing the custom layout and the custom adapter.

http://www.androidhive.info/2012/02/android-custom-listview-with-image-and-text/

Answer 2

It's a general Layout example to make custom listview :

Main Activity Layout :

<?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" >

    <ListView
        android:id="@+id/list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
     />
</LinearLayout>

ListView Row layout XML (list.xml) :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
    <ImageView
        android:id="@+id/icon"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:contentDescription="@string/image"
        android:paddingLeft="10dp"
        android:paddingRight="10dp" />

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/icon"
        android:paddingBottom="10dp"
        android:textColor="#CC0033"
        android:textSize="16dp" />

    <TextView
        android:id="@+id/desc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/title"
        android:layout_toRightOf="@+id/icon"
        android:paddingLeft="10dp"
        android:textColor="#3399FF"
        android:textSize="14dp" />
</RelativeLayout>