Android UI Layouts

In this tutorial you will learn about the Android UI Layouts and its application with practical example.

Layout is a basic building block of an Application, It is a visual structure for UI, It is associate with activity,fragment, dialogs etc.
There are two ways to declare a layout:
1. Declare UI element in XML: Android provides XML vocabulary, you can quickly design UI Layouts with the help of XML, in the same way you create web pages in HTML.

Table Of Contents

Lets create a XML layout which uses a vertical LinearLayout

After declare layout in XML, Lets know the way from which you can associate this xml layout with your activity:

The onCreate() callback method is called when your activity is launched.

 

Types of Layouts

1.Linear Layout : This layout align all children in single direction , vertically or horizontally.

2.Relative Layout : Relative Layout is a view group that display child views in relative position.

 

3.Table Layout : It displays its child views in row and columns.

4.Absolute Layout : It gives you feature to specify exact location of its children.

5.Frame Layout : It is a placeholder on screen for using display a single view.

6.ListView : ListView is a view group which displays a list of scrollable items.The list items are auto inserted into list using adapter.

7.GridView : GridView is a ViewGroup that display large amount of items in two-dimensional , scrollable grid.

8.RecycleView : An advance version of ListView is RecycleView. Just like ListView ,it is used to display large amount of similar items on screen.

 

 

Attributes

Attributes define visual properties of layout and each layout has set of attributes. Some of the common attributes are listed below which are used in all types of Layouts:

1.ID : It uniquely identify the View, Any View may have an integer Id which associate with it. Syntax of id is:

  1. Width : This is the width of layout , the syntax for using this attribute is

android: layout_width=”match_parent”

3.Height : This is the height of layout, the syntax for using this attribute is :

 

android:layout_height=”match_parent”

4.Margin Top : It is used to give extra space from top side , syntax for using this attribute is:

android:layout_marginTop=”5dp”

5.Margin Bottom : It is used to give extra space from bottom side , syntax for using this attribute is:

android:layout_marginBottom=”5dp”

 

6..Margin Left : It is used to give extra space from left side , syntax for using this attribute is:

android:layout_marginLeft=”5dp”

 

7.Margin Right : It is used to give extra space from right side , syntax for using this attribute is:

android:layout_marginRight=”5dp”

8.Padding Left : It is used to give padding from left side for the layout , syntax for using this attributes is:
android:paddingLeft=”5dp”

9..Padding Right : It is used to give padding from right side for the layout , syntax for using this attributes is:
android:paddingRight=”5dp”

10.Padding Top : It is used to give padding from top side for the layout , syntax for using this attributes is:
android:paddingTop=”5dp”

11.Padding Bottom : It is used to give padding from bottom side for the layout , syntax for using this attributes is:
android:paddingBottom=”5dp”

In this tutorial we have learn about the Android UI Layouts and its application with practical example. I hope you will like this tutorial.