Question

I have the following code in my XML file:

        <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="60dip"
        android:layout_marginLeft="13dp"
        android:layout_marginRight="13dp"
        android:layout_marginTop="20dp"
        android:background="@color/white"
        android:orientation="vertical" >

        <RelativeLayout
            android:id="@+id/name_view"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

            <ImageView
                android:id="@+id/pic"
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="6dp" />

            <EditText 
                android:id="@+id/name"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="15dp"
                android:layout_alignRight="@id/pic" />          
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/phone_view"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

            <ImageView
                android:id="@+id/phone_pic"
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_marginLeft="6dp"
                android:layout_weight="0.15" />

            <EditText 
                android:id="@+id/phone_number"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="15dp"
                android:layout_alignRight="@id/phone_pic" />            
        </RelativeLayout>

    </LinearLayout> 

I want the ImageView and EditText field inside the RelativeLayout and the EEditText Field to the right of the ImageView. However, when i check the graphical layout, the EditText and ImageView are placed outside the RelativeLayout as well as the LinearLayout. What am I doing wrong and how to correct this?

Answer 1

Why don’t you replace your RelativeLayout with horizontal LinearLayout

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="60dip"
    android:layout_marginLeft="13dp"
    android:layout_marginRight="13dp"
    android:layout_marginTop="20dp"
    android:background="@color/white"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/name_view"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/pic"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_marginLeft="6dp" />

        <EditText 
            android:id="@+id/name"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="15dp" />          
    </LinearLayout>

    <LinearLayout
        android:id="@+id/phone_view"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/phone_pic"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_marginLeft="6dp"
            android:layout_weight="0.15" />

        <EditText 
            android:id="@+id/phone_number"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="15dp" />            
    </LinearLayout>

</LinearLayout>