Android - RelativeLayout

Relative Layout 

Relative Layout is a container which has enhanced features than the previous Linear Layout.  This layout allows gui components to be placed relative to other components.  Android provides us with many attributes to help us to place components relative to one another.

1. Components can be placed relative to one another 

2. Components can be placed relative to the container.

Important attributes of RelativeLayout.LayoutParams.  Please follow link below to get a fair idea of RelativeLayout. 

http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html

Exampe of one of the important attributes in RelativeLayout.

1. layout_toRightOf - the current component which has this attribute will be placed to the right of the specified id.

eg. 

  TextField 1 | TextField 2

In the above case TextField 2 is placed to the right of TextField1.  In this case we write the layout_toRightOf as follows. 

<EditText

android:id="@+id/TextField2"

android:layout_toRightOf("Id of TextField1")  />

I have given an example code and its corresponding screenshot. 

ScreenShot of a screen built using RelativeLayout.

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

    <TextView

        android:id="@+id/lbl_PersonalInfo"

        android:text="Personal Information"

        android:textSize="25dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content" />

    <TextView

        android:layout_below="@+id/lbl_PersonalInfo"

        android:id="@+id/lbl_first_name"

        android:text="FirstName"

        android:layout_marginTop="20dp"

        android:layout_marginLeft="20dp"

        android:layout_marginBottom="20dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content" />

    <EditText

        android:id="@+id/txt_first_name"

        android:layout_toRightOf="@+id/lbl_first_name"

        android:layout_below="@+id/lbl_PersonalInfo"

        android:layout_marginRight="10dp"

        android:layout_width="match_parent"

        android:layout_height="wrap_content" />

    <TextView

        android:id="@+id/lbl_last_name"

        android:layout_below="@+id/lbl_first_name"

        android:text="Last Name"

        android:layout_marginTop="10dp"

        android:layout_marginLeft="20dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content" />

    <EditText

        android:id="@+id/txt_last_name"

        android:layout_below="@+id/txt_first_name"

        android:layout_toRightOf="@+id/lbl_last_name"

        android:layout_marginRight="10dp"

        android:layout_width="match_parent"

        android:layout_height="wrap_content" />

    <TextView

        android:id="@+id/lbl_DateOfBirth"

        android:layout_below="@+id/lbl_last_name"

        android:layout_marginTop="20dp"

        android:layout_marginLeft="20dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Date of Birth"

        />

    <EditText

        android:id="@+id/txt_Day"

        android:layout_toRightOf="@+id/lbl_DateOfBirth"

        android:layout_below="@+id/lbl_last_name"

        android:layout_marginLeft="10dp"

        android:layout_marginRight="10dp"

        android:layout_width="80dp"

        android:layout_height="wrap_content" />

    <EditText

        android:id="@+id/txt_Month"

        android:layout_toRightOf="@+id/txt_Day"

        android:layout_below="@+id/lbl_last_name"

        android:layout_marginLeft="10dp"

        android:layout_marginRight="10dp"

        android:layout_width="80dp"

        android:layout_height="wrap_content" />

    <EditText

        android:id="@+id/txt_Year"

        android:layout_toRightOf="@+id/txt_Month"

        android:layout_below="@+id/lbl_last_name"

        android:layout_marginLeft="10dp"

        android:layout_marginRight="10dp"

        android:layout_width="80dp"

        android:layout_height="wrap_content" />

    <TextView

        android:id="@+id/lbl_Address"

        android:layout_below="@+id/lbl_DateOfBirth"

        android:layout_marginTop="20dp"

        android:layout_marginLeft="20dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Address"

        />

    <EditText

        android:id="@+id/txt_Address"

        android:layout_below="@+id/lbl_DateOfBirth"

        android:layout_toRightOf="@+id/lbl_Address"

        android:layout_alignParentRight="true"

        android:layout_marginRight="10dp"

        android:layout_marginLeft="10dp"

        android:layout_width="match_parent"

        android:layout_height="wrap_content" />

    <TextView

        android:id="@+id/lbl_states"

        android:layout_below="@+id/lbl_Address"

        android:text="State"

        android:layout_marginTop="20dp"

        android:layout_marginLeft="20dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content" />

    <Spinner

        android:id="@+id/spin_states"

        android:layout_below="@+id/lbl_Address"

        android:layout_toRightOf="@+id/lbl_states"

        android:layout_marginTop="15dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content">

    </Spinner>

    <ImageView

        android:id="@+id/img_qm"

        android:src="@drawable/question_blue"

        android:layout_below="@+id/txt_Address"

        android:layout_toRightOf="@+id/spin_states"

        android:layout_toEndOf="@+id/spin_states"

        android:layout_marginTop="13dp"

        android:layout_marginLeft="5dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content" />

</RelativeLayout>