Understanding Layouts in Android

A layout defines the visual structure for a user interface, such as the UI for an activity or app widget. You 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.
• Instantiate layout elements at runtime. Your application can create View and ViewGroup objects (and manipulate their properties) programmatically.

In Android, there are various types of layouts available which are used to design the screen or we can say, are used to arrange the order of various widgets(like- TextView, EditText, Button, Image, ImageButton etc.) in the required manner. In Android terms, the layouts are called as ViewGroups and widgets are called as Views.

The wise use of different layouts in the screen can reduce the development time and effort and even can save you from the later stage issues (like- inserting more widgets in the screen in later stage, porting to different screen resolutions, we will discuss it in the upcoming posts).

So, Lets start understanding the behavior of different layouts:

 

Linear Layout:

 Linear layout arranges all the children widgets in one direction like- vertical or horizontal as shown in the image.

So, where ever we want some widgets to be aligned in a single direction, we can make use of Linear Layout.

Remember that designing the android screen goes from top to down fashion.

Android has given three amazing properties- wrap_content, match_parent, fill_parent to declare the height and width of the layouts and widgets. The one should make use of them very wisely. Never practice declaring the absolute height and width of any view. The best way is to use property wrap_content maximally.

Relative Layout:

 Relative layout arranges the children widgets relative to the parent layout or relative to each other. Best way to understand it, look at the image.

Table Layout: Table layout arranges the children widgets in the table, i.e. rows and columns, look at the image.

Frame Layout:

Frame layout arranges the children widgets relative to top left point. In this way, the widgets may get overlapped as shown in the image.

Absolute Layout: Absolute layout pins the children widgets in the coordinate points as shown in the image.

However, this layout is advised not to practice as it raises the issues while designing the same layout for different screen resolutions. Even it has been deprecated in the latest versions of Android.

Hope you enjoyed.

Comments and Questions are welcome.

Some of contents this post is taken from one of my friend's Deepak Garg Blog