What is Relative Layout and related layouts ?

Relative Layout:

In mainxml file of an android studio, we take relative layout because when we place different components on the screen all the components are relative to each other we assign the required parameters to place the different components according to our need.To understand it better it’s a better idea to take the component’s one by one and see the effect of it accordingly.Here we take a button initially.

  • android:layout_centerVertical:
  • android:layout_centerVertical

This is used to place the button in the center of vertical position.


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.sakshi.relativelayoutdesigns.MainActivity">


    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
      android:layout_centerVertical="true"
        android:text="Button" />
</RelativeLayout>
  • android:layout_centerHorizontal:
  • android:layout_centerHorizontal

    This is used to place the button at the center of the horizontal position.

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="com.example.sakshi.relativelayoutdesigns.MainActivity">
    
    
        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:text="Button" />
    </RelativeLayout>

  • centerInParent:
android:layout_centerInParent="true"

This is used to place the component in the middle of the screen.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.sakshi.relativelayoutdesigns.MainActivity">


    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Button" />
</RelativeLayout>

  • allignParentLeft:

This is used to place the button to the left side relative to the parent of the button, as we can see here that parent is the relative layout of the screen and the child is the button.

android:layout_alignParentLeft="true"
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.sakshi.relativelayoutdesigns.MainActivity">


    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:text="Button" />
</RelativeLayout>

  • allignParentRight:
android:layout_alignParentRight="true"

This is used to place the button to the right side relative to the parent of the button, as we can see here that parent is the relative layout of the screen and the child is the button.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.sakshi.relativelayoutdesigns.MainActivity">


    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="Button" />
</RelativeLayout>

 

 

Leave a Reply