Trying to space items in a ListView while using adapter and drawable. Margin is not working

Question

I am trying to have a listview where items have rounded corners and the items are spaced out from each other. This is done using a custom ArrayAdapter.

MyCustomAdapter arrAdapter = new MyCustomAdapter();
setListAdapter(arrAdapter);

I am using a drawable image to round the corners

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >

  <corners android:radius="10dp" />

  <gradient
    android:angle="90"
    android:endColor="#993333"
    android:startColor="#ffffff"
    android:type="sweep" />

  <solid android:color="#ffffff" />

  <stroke
    android:width="1dp"
    android:color="#000000"  />
</shape>

and setting it in the layout as background to the top most container - the LinearLayout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="4dp"
android:background="@drawable/square"
android:orientation="horizontal" >

<TextView
    android:id="@+id/routeTag"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:background="@drawable/circle"
    android:padding="10dp"
    android:text="text"
    android:textAppearance="?android:attr/textAppearanceLarge" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/stop"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:text="some text"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="14sp" />

        <TextView
            android:id="@+id/stopD"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:padding="5dp"
            android:text="(text)"
            android:textColor="#777777"
            android:textSize="10sp" />
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/nextTT"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="5dp"
            android:paddingLeft="5dp"
            android:paddingRight="9dp"
            android:paddingTop="5dp"
            android:text="text"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="14sp" />

        <TextView
            android:id="@+id/moreTT"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_toRightOf="@id/nextTrainTime"
            android:paddingBottom="5dp"
            android:text="text"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="12sp" />
    </RelativeLayout>
</LinearLayout>

</LinearLayout>

For some reason in the graphical display I am able to see that single element exactly as I want it - with margins all around (I also want it to move away from the edges of the screen left and right). But when I run this and let the adapter do its job I am getting a list of items, touching the sides of the screen and no space between them apart forma single line which is used to separate the items on a normal list.

Anyone have a clue how to make it behave?! I have search far and wide.

Thanks for your help

Answer 1

The space between your item and widescreen can be done with:

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

   <item android:left="10dp"
      android:right="10dp" 
      android:top="10dp" 
      android:bottom="10dp">
      <shape android:shape="rectangle">...</shape>
</item>

In my case I used android:divider and android:dividerHeight on a ListView block to seperate each element of a ListView, and the left-right space with the android:left android:right properties.

The post where I got the info was this