Android Relative Layout

In this tutorial,I will tell you how to arrange the elements/components with respect to other's by using Relative Layout.

In a relative layout every element arranges relatively to other elements,It provides the flexibility to insert an element in left,right,top and bottom of other element.
It’s the most flexible layout, that allow you to position your component to display in anywhere you want.

Some of the many layout properties available to views in a RelativeLayout include:

android:layout_alignParentTop

If "true", makes the top edge of this view match the top edge of the parent.

android:layout_centerVertical

If "true", centers this child vertically within its parent.

android:layout_below

 Positions the top edge of this view below the view specified with a resource ID.

android:layout_above


Positions the top edge of this view above the view specified with a resource ID.

android:layout_toRightOf 

Positions the left edge of this view to the right of the view specified with a resource ID.

The value for each layout property is either a boolean to enable a layout position relative to the parent RelativeLayout or an ID that references another view in the layout against which the view should be positioned.In your XML layout, dependencies against other views in the layout can be declared in any order. For example, you can declare that "viewOne" be positioned below "viewTwo" even if "viewTwo" is the last view declared in the hierarchy.

Now we are taking a very simple example to show overall concept of relative layout.

• Create a new project File -> New -> Android Project

• In Package Explorer right click on res/layout folder and create a new Android XML File and name it as your choice.
• res/layout -> Right Click -> New -> Android XML File

• Now open newly created xml file (in my case “relativelayout.xml”) and put the following code under this file.

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

    <TextView
        android:id="@+id/AndroidEmail"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Email" />

    <EditText
        android:id="@+id/inputEmail"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/AndroidEmail" />

    <Button
        android:id="@+id/BtnLogin"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/inputEmail"
        android:layout_marginRight="10px"
        android:text="Login" />

    <Button

        android:id="@+id/Canceled"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@id/BtnLogin"
        android:layout_toRightOf="@id/BtnLogin"
        android:text="Cancel" />

</RelativeLayout>

• To run the application, right click on the project -> Run As -> Android Application. You should see following result in your device.

Output:

                       

Please Share this tutorial On: