Introduction to Layouts or ViewGroups

All the interaction of a user with the Android application is through the user interface(UI), hence it is very important to understand the basics about the User Interface of an android application. We have already learned about the various Views available in Android OS to create various UI components of your Android App.

But how will you arrange all those view components to appear in an ordered manner on the device screen. Android Layouts are used to arrange the views on the device's screen.

ViewGroup is the base class for all the layouts and view containers.


ViewGroup

A ViewGroup is a special view that can contain other views. The ViewGroup is the base class for Layouts in android, like LinearLayout, RelativeLayout, FrameLayout etc.

In other words, ViewGroup is generally used to define the layout in which views(widgets) will be set/arranged/listed on the android screen.

ViewGroups acts as an invisible container in which other Views and Layouts are placed. Yes, a layout can hold another layout in it, or in other words a ViewGroup can have another ViewGroup in it.

The class ViewGroup extends the class View.

We will learn about Layouts in the upcoming lessons.


Most commonly used Android layout types

  • LineraLayout
  • RelativeLayout
  • Web View
  • TabularLayout
  • ListView
  • GridView


Yes, ListView and GridView can act both as a View and a ViewGroup. You would ask how? Well, if we use the ListView view to show some data in list form, it acts as a View. But if we use it for creating a list of some other view, for example an ImageView then it acts as a ViewGroup.

Also, the ViewGroup subclasses extends the class ViewGroup, which in turn extends the class View, so in a way all the ViewGroup subclasses are actually views, with some extra features.


Programmatic and Declarative Approach

To create/define a View or a ViewGroup in your android application, there are two possible ways:

  1. The Programmatic Approach: In this we define/create our Views in the Java source file. We will learn about this approach in details later, as of now here is a sample code to add a Button to our view.
    Button myButton = new Button(this);
    myButton.setLayoutParams(new LinearLayout.LayoutParams(
                                            LinearLayout.LayoutParams.MATCH_PARENT,
                                            LinearLayout.LayoutParams.MATCH_PARENT));
    
    myLayout.addView(myButton);

    So addView() is the function used to add any View to the UI and setLayoutParams() function is used to set the various attributes.

  2. The Declarative Approach: In this we define the View and ViewGroups directly in the design XML files, like we will be doing in the next couple of tutorials where we will study about various commonly used views.

In the comming tutorials we will learn about each of the popular layout types, how they can be used to arrange different view components, hence defining your Android app's user interface.