Android Relative Layout

Android Relative Layout enables you to specify how child views are positioned relative to each other. The position of each view can be specified as relative to sibling elements or relative to the parent.

Relative

Relative Layout

RelativeLayout Attributes

Following are the important attributes specific to RelativeLayout −

Sr.No. Attribute & Description
1

android:id

This is the ID which uniquely identifies the layout.

2

android:gravity

This specifies how an object should position its content, on both the X and Y axes. Possible values are top, bottom, left, right, center, center_vertical, center_horizontal etc.

3

android:ignoreGravity

This indicates what view should not be affected by gravity.

Using RelativeLayout, you can align two elements by right border, or make one below another, centered in the screen, centered left, and so on. By default, all child views are drawn at the top-left of the layout, so you must define the position of each view using the various layout properties available from RelativeLayout.LayoutParams and few of the important attributes are given below −

Sr.No. Attribute & Description
1

android:layout_above

Positions the bottom edge of this view above the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name"

2

android:layout_alignBottom

Makes the bottom edge of this view match the bottom edge of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

3

android:layout_alignLeft

Makes the left edge of this view match the left edge of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

4

android:layout_alignParentBottom

If true, makes the bottom edge of this view match the bottom edge of the parent. Must be a boolean value, either "true" or "false".

5

android:layout_alignParentEnd

If true, makes the end edge of this view match the end edge of the parent. Must be a boolean value, either "true" or "false".

6

android:layout_alignParentLeft

If true, makes the left edge of this view match the left edge of the parent. Must be a boolean value, either "true" or "false".

7

android:layout_alignParentRight

If true, makes the right edge of this view match the right edge of the parent. Must be a boolean value, either "true" or "false".

8

android:layout_alignParentStart

If true, makes the start edge of this view match the start edge of the parent. Must be a boolean value, either "true" or "false".

9

android:layout_alignParentTop

If true, makes the top edge of this view match the top edge of the parent. Must be a boolean value, either "true" or "false".

10

android:layout_alignRight

Makes the right edge of this view match the right edge of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

11

android:layout_alignStart

Makes the start edge of this view match the start edge of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

12

android:layout_alignTop

Makes the top edge of this view match the top edge of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

13

android:layout_below

Positions the top edge of this view below the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

14

android:layout_centerHorizontal

If true, centers this child horizontally within its parent. Must be a boolean value, either "true" or "false".

15

android:layout_centerInParent

If true, centers this child horizontally and vertically within its parent. Must be a boolean value, either "true" or "false".

16

android:layout_centerVertical

If true, centers this child vertically within its parent. Must be a boolean value, either "true" or "false".

17

android:layout_toEndOf

Positions the start edge of this view to the end of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

18

android:layout_toLeftOf

Positions the right edge of this view to the left of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

19

android:layout_toRightOf

Positions the left edge of this view to the right of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

20

android:layout_toStartOf

Positions the end edge of this view to the start of the given anchor view ID and must be a reference to another resource, in the form "@[+][package:]type:name".

Example

Following is the content of the modified main activity file src/com.example.demo/MainActivity.java. This file can include each of the fundamental lifecycle methods.

package com.example.demo;

import android.os.Bundle;
import android.app.Activity;

public class MainActivity extends Activity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
   }
   
}

Following will be the content of res/layout/activity_main.xml file −

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/content_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"
        android:text="Medium Text"
        android:layout_marginTop="20dp"
        android:id="@+id/textView"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_below="@+id/textView"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="40dp" />

    <Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Switch"
        android:id="@+id/Switch"
        android:layout_centerVertical="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <ToggleButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New ToggleButton"
        android:id="@+id/toggleButton"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <SeekBar
        android:layout_marginBottom="50dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/seekBar"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true" />

</RelativeLayout>

Following will be the output

Relative Layout Examp;le



×