Hierarchy of View

In this tutorial, we provide an overview of how layouts fit into the Android application architecture. We also explore some of the specific layout controls available for organizing application screen content in a variety of interesting ways.

As similar to website and other programming, User interface is an important part of Mobile App Development. So Android Layouts is used to define the user interface which holds the UI controls or widgets that will appear on the screen of an android application or activity.

What is Layout in Android ?

The user interface in the android app is made with a collection of View and ViewGroup objects. Generally, the android apps will contain one or more activities and each activity is one screen of the app. The activities will contain multiple UI components and those UI components are the instances of View and ViewGroup subclasses.

The View is a base class for all UI components in android and it is used to create an interactive UI components such as TextView, EditText, Checkbox, Radio Button, etc. and it responsible for event handling and drawing.

The ViewGroup is a subclass of View and it will act as a base class for layouts and layouts parameters. The ViewGroup will provide an invisible containers to hold other Views or ViewGroups and to define the layout properties.

Hierarchy of View

We can declare a layout in two ways:

  • Declare UI elements in XML. Android provides a straightforward XML vocabulary that corresponds to the View classes and subclasses, such as those for widgets and layouts.
  Ex.:-<TextView
            android:layout_width="fill_parent"
            android:id="@+id/PhotoLabel"
            android:layout_height="wrap_content"
            android:text="@string/my_text_label"
            android:gravity="center_horizontal"
            android:textSize="20dp" />
  • Instantiate layout elements at runtime. Your app can create View and ViewGroup objects (and manipulate their properties) programmatically .
Ex.: TextView label = new TextView(this);
     label.setText(R.string.my_text_label);
     label.setTextSize(20);
     label.setGravity(Gravity.CENTER_HORIZONTAL);

Different Types of Layout in Android :-

  • Linear Layout :- LinearLayout is a view group used to provide child View elements one by one that aligns all children in a single direction, vertically or horizontally.
  • Relative Layout :- RelativeLayout is a view group that displays child views in relative positions.
  • Constraint Layout :- ConstraintLayout is a ViewGroup subclass, used to specify the position of a layout constraints for every child View relative to other views present. A ConstraintLayout is similar to a RelativeLayout, but having more power.
  • Frame Layout :- FrameLayout is a ViewGroup subclass which is used to specify the position of View instances it contains on the top of each other to display only a single View inside the FrameLayout.
  • Absolute Layout :- AbsoluteLayout enables you to specify the exact location of its children.
  • Table Layout :- TableLayout is a view that groups views into rows and columns.
  • List View :- ListView is a view group that displays a list of scrollable items.
  • Grid View :- GridView is a ViewGroup that displays items in a two-dimensional, scrollable grid.

Android Layout Attributes :-

In Android each layout has a set of attributes, which defines their visual priperties .

AttributeDescription
android:idIt is used to uniquely identify the view and ViewGroups
android:layout_widthIt is used to define the width for View and ViewGroup elements in a layout
android:layout_heightIt is used to define the height for View and ViewGroup elements in a layout
android:layout_marginLeftIt is used to define the extra space in the left side for View and ViewGroup elements in a layout
android:layout_marginRightIt is used to define the extra space in right side for View and ViewGroup elements in layout
android:layout_marginTopIt is used to define the extra space on top for View and ViewGroup elements in layout
android:layout_marginBottomIt is used to define the extra space in the bottom side for View and ViewGroup elements in a layout
android:paddingLeftIt is used to define the left side padding for View and ViewGroup elements in layout files
android:paddingRightIt is used to define the right side padding for View and ViewGroup elements in layout files
android:paddingTopIt is used to define padding for View and ViewGroup elements in layout files on top side
android:paddingBottomIt is used to define the bottom side padding for View and ViewGroup elements in layout files
android:layout_gravityIt is used to define how child Views are positioned
android: layout_weightSpecifies how much of the extra space in the layout should be allocated to the View.
android: layout_xThis specifies the x-coordinate of the layout.
android: layout_yThis specifies the y-coordinate of the layout.
Attributes of Layout

Thank you 🙂

%d bloggers like this: