Android RelativeLayout With Example

Relative layout is a viewgroup that extends android.view.viewgroup , the relative layout lays it's child views or elements with respect to it siblings or to its parent .

Advantage of Relative Layout Over Other Layouts

1.  Relative Layout helps in achieve desired user interface efficiently.
2.  Avoid use of nested linear layout and make use of relative layout because nesting of layout increases the length of xml source file as a result makes it hard to read and also effects the performance of the application . 

Lets See an Example Relative Layout

Project Detail

Project Name	Relative_layout
Package	com.pavan.relative_layout
Minimum SDK	API 8
Target SDK	API 17
Theme	Holo Light with Dark Action Bar

1. XML Layout

file :- relative_layout.xml

<RelativeLayout
    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" >

    <Button
        android:id="@+id/button1"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="Button 1" />

    <Button
        android:id="@+id/button2"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="37dp"
        android:layout_toRightOf="@+id/button1"
        android:text="Button 2" />

    <Button
        android:id="@+id/button3"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="150dp"
        android:text="Button 3" />

    <Button
        android:id="@+id/button5"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/button2"
        android:layout_below="@+id/button2"
        android:layout_marginTop="70dp"
        android:text="Button 5" />

    <Button
        android:id="@+id/button6"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/button3"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="22dp"
        android:text="Button 6" />

</RelativeLayout>

2. Activity

Create a Relative_layout.class and extend it to activity class and override the onCreate() method of activity class and set the content of the actvity with the above defined xml file by calling setContentView() method and pass the above defined layout xml file name as a parameter to it

                                    setContentView(relative_layout);

file :- Relative_layout.java

package com.example.com.pavan.relative_layout;
import android.os.Bundle;
import android.app.Activity;

public class Relative_layout extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.relative_layout);
    }
}

3. RUN

In the above Example of Relative Layout

 Button 2 is Right of Button 1
 Button 5 is below Button 2
 Button 3 is above Button 6