Introduction to Android Views and ViewGroups

All the interaction of a user with the Android application is through the user interface(UI) which is app screen, that’s why it is very important to understand the basics about the User Interface of an android app. Here in this section, we are going to cover various Views and ViewGroups and will try to explain how they can be used to design the User Interface(UI) of an android application.

Views:

View is the basic building block of UI(User Interface) in android app. View refers to the android.view.View class, which is the uper class for all the GUI components like TextView, ImageView, Button etc.

View class extends Object class and implements Drawable.Callback, KeyEvent.Callback and AccessibilityEventSource, we can also check in android MainActivity.java file.

View can be known as rectangle on the screen that shows some type of content and It can be an image, text, a button or anything that an android application can display. The rectangle here is actually now showing, but every view occupies a rectangle shape, in view.

match_parent means it will take up the complete space available on the display of the device.
Whereas, wrap_content means it will occupy only that much space as required for its content to display, it depends on content.


<ViewName
    Attribute1=Value1
    Attribute2=Value2
    Attribute3=Value3
    .
    .
    AttributeN=ValueN
/>

A View is also known as Widget in an Android and any visual(that we can see on screen as a view) and interactive(by which user can interact with) is called a Widget.

XML syntax for creating a View

Now, as we have explained earlier as well and to draw anything in your android application, you will have to define it in the design XML files in layout folder. And to add this functionality we will create Java files.

<ViewName
    Attribute1=Value1
    Attribute2=Value2
    Attribute3=Value3
    .
    .
    AttributeN=ValueN
/>

It always starts with an angle bracket, followed by the View name and we will introduce you to various types of Views very soon.
Then we write attributes that will be define how that view will look on the screen of the application along with a value for the attribute. Each view has its own attributes which we will discuss in the next few tutorials which will cover various types of views.
In the end, it is closed by />

Basically there are two attributes that are necessary for every View. These are: android:layout_height and android:layout_width

Apart from the above described attributes, attributes like gravity, margin and padding are some other commonly used attributes.

Most commonly used Android View classes

Here we have some of the most commonly used android View classes such as:

TextView
EditText
Button
ImageView
ImageButton
CheckBox
RadioButton
ListView
GridView
DatePicker
Spinner,etc.

Programmatic and Declarative Approach

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

The Programmatic Approach: In this approach we define/create our Views in the Java source file. We will learn about this approach in detail 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.

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

Learn Android

Introduction to Android Views and ViewGroups