Some issues with the row layout of a ListView

I have the following very basic layout for each row of a ListView. The two TextViews should be one on top of the other or in other words in two lines or such. However, I am seeing them in the same line or not seeing them at all. Also, sometimes I see that the rows height is very big. Can anyone tell me what's the problem with my layout?

<?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="100px" >

    <ImageView
        android:id="@+id/icon"
        android:layout_width="60px"
        android:layout_height="45px"
        android:layout_marginLeft="4px"
        android:layout_marginRight="4px"
        android:layout_ma开发者_如何学CrginTop="4px"
        android:src="@drawable/ahsan" >
    </ImageView>

    <TextView
        android:id="@+id/label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_x="70px"
        android:layout_y="60px"
        android:text="@+id/TextView01"
        android:textSize="18px" >
    </TextView>

    <TextView
        android:id="@+id/label2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_x="70px"
        android:layout_y="90px"
        android:text="@+id/TextView02"
        android:textSize="18px" >
    </TextView>

</LinearLayout>

Add android:orientation="vertical" attribute in the LienarLayout tag

Try this code,

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

<ImageView 
android:id="@+id/icon" 
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="@drawable/icon" 
android:layout_marginLeft="4px">
</ImageView>
<TextView 
android:text="@+id/TextView01" 
android:layout_width="wrap_content"
android:layout_height="wrap_content" 
android:id="@+id/label"
android:textSize="18px"
android:layout_toRightOf="@+id/icon"
android:layout_y="60px">
</TextView>

<TextView 
android:text="@+id/TextView02" 
android:layout_width="wrap_content"
android:layout_height="wrap_content" 
android:id="@+id/label2"
android:textSize="18px"
android:layout_below="@+id/label"
android:layout_toRightOf="@+id/icon">
</TextView>

</RelativeLayout>

According to the android documentation the default orientation of the LinearLayout is horizontal, which means, your ImageView and TextViews are in one line. So the too big height of your line is caused by the height of the ImageView.

Add android:orientation="vertical" to the LinearLayout parameters.

Copy paste the follwing code in your layout..It will work.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="fill_parent"
    android:padding="5dip" android:layout_height="fill_parent">
    <TextView android:id="@+id/name"
        android:layout_alignParentLeft="true" android:layout_height="40dip"
         android:layout_width="wrap_content"
        android:textSize="18dp" android:text="Name"></TextView>
    <TextView android:id="@+id/phone" android:layout_below="@id/name"
         android:layout_height="40dip"
        android:layout_width="wrap_content" android:textSize="18dp"
        android:text="Name"></TextView>

    <TextView android:layout_width="wrap_content" android:id="@+id/style"
        android:textSize="18dp" android:layout_alignParentRight="true"
        android:layout_height="wrap_content" android:text="Style"
        android:textColor="#0E8C3A" />

<TextView android:id="@+id/icon" android:layout_width="wrap_content"
        android:layout_below="@id/style"  android:text="Style"
        android:layout_height="wrap_content" android:layout_alignParentRight="true"></TextView>
</RelativeLayout>