Android layout margins showing different results on AVD/Physical device

Question

I'm using a cards-UI layout in my app. It looks fine on both AVD (GN 4.2) and my physical device (Galaxy mini 2.3) except for the margins which is shown differently.

AVD:

Physical device:

As you can see, on mini, there's no left margin.

Anyone knows what am I doing wrong and how can I resolve this?

---

My layout codes:

list_row.xml:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?android:attr/listPreferredItemHeight">

    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    android:layout_marginTop="0dp"
    android:layout_marginBottom="0dp"
    android:background="@drawable/card_layout">

        <TextView
        android:id="@+id/post_text"    
        android:layout_gravity="left|center_vertical"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:textColor="@android:color/primary_text_light"
        android:layout_height="wrap_content"
        android:layout_marginBottom="5dp" />

    </LinearLayout>

</FrameLayout>

main_activity.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#e5e5e5"
    android:orientation="vertical" >

    <ListView
        android:id="@+id/posts_list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_marginTop="5dp"
        android:divider="@null"
        android:dividerHeight="0dp" >
    </ListView>

</LinearLayout>

card_layout.xml:

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

<item android:bottom="8dp">
    <shape
        android:dither="true"
        android:shape="rectangle">            
        <corners android:radius="2dp" />           
        <solid android:color="#ccc" />
    </shape>
</item>
<item android:bottom="10dp">
    <shape
        android:dither="true"
        android:shape="rectangle" >            
        <corners android:radius="2dp" />            
        <solid android:color="@android:color/white" />

        <padding
            android:bottom="8dp"
            android:left="8dp"
            android:right="8dp"
            android:top="8dp" />
    </shape>
</item>

</layer-list>

Answer 1

Using margins with layerlist drawables casued similar problem to me once. If you set padding to root instead setting margin, your problem will be solved.

After changes your list_row.xml should be:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/listPreferredItemHeight" 
    android:paddingLeft="8dp"
    android:paddingRight="8dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/card_layout" >

        <TextView
            android:id="@+id/post_text"
            android:layout_width="0dip"
            android:layout_height="wrap_content"
            android:layout_gravity="left|center_vertical"
            android:layout_marginBottom="5dp"
            android:layout_weight="1"
            android:textColor="@android:color/primary_text_light" />
    </LinearLayout>

</FrameLayout>

Hope this helps.