Linear layout and relative layout

Difference between Linear layout and Relative layout

In this tutorial, we will learn about the difference between Linear layout and Relative layout.

Linear Layout :

  • LinearLayout is a view group responsible for keeping the view horizontal or vertical. This is a layout that allows groups to be arranged horizontally or vertically.
  • Linear Layout is the simplest layout, it can arrange elements one after another horizontally or vertically. The following attributes are used to position the control in a linear layout: android: Alignment: Used to position the control horizontally or vertically in the container.

Learn Java Programming & get Certificate

Click to download

Relative Layout :

  • Relative Layout is a view that display nested views in relative position. The position of each view can be relative to the sibling view (for example, on the left or below another view) or relative to the position of the main area of ​​the Relative Layout (example-> bottom, left, or center). .
  • Relative layout is a very flexible layout, Android is used to customize the layout layout. This allows us to position our components/views based on the position of relative or sibling components. It’s simple, because we can place components anywhere.

Linear Layout Syntax

 <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
         android:orientation="vertical or Horizontal">
            </LinearLayout>

Relative Layout Syntax

   <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        
    </RelativeLayout>

Linear Layout Code

<?xml version="1.0" encoding="utf-8"?>
<layout 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">

  
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:orientation="vertical">

        <androidx.cardview.widget.CardView
            android:id="@+id/card_View"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:clickable="true"
            android:focusable="true"
            app:cardBackgroundColor="@color/teal_700"
            app:cardCornerRadius="10dp"
            app:cardElevation="10dp">

            <LinearLayout
                android:id="@+id/list_item_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/name_text_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:fontFamily="serif"
                    android:textColor="@color/black"

                    android:textSize="30sp"
                    tools:text="Sagar Paliwal" />

                <TextView
                    android:id="@+id/email_text_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="23dp"
                    android:layout_margin="10dp"
                    android:fontFamily="serif"
                    android:textColor="@color/black"

                    android:textSize="24sp"
                    tools:text="xyz@gmail.com" />


            </LinearLayout>
        </androidx.cardview.widget.CardView>


    </LinearLayout>
</layout>

Preview of Linear Layout

linear layout

Relative Layout Code

<?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"
    android:paddingLeft="16dp"
    android:paddingRight="16dp">

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"

        android:orientation="vertical">

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:text="DEMO 1" />

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="DEMO 2" />

        
    </RelativeLayout>

</RelativeLayout>

 

Preview of Relative Layout

  • We hope that this guide will assist you in quickly demonstrate about difference between Linear layout and Relative layout . If you have any problems, please post them in the comments section and we will gladly assist you.

Android RecyclerView in Kotlin with Example

Option Menu in Android With Example

Webview in Android with Example

This Post Has 2 Comments

Leave a Reply