DAY 3: View Groups In Android

My First Encounter With View Groups In My Journey Of Android Development




I promised to myself and to you guys that I would publish at least one post (which I would call a “day”)  every single day.  Even though I had time to study Android development for a couple of hours yesterday before going to work, I didn’t manage to create a post. I need to work on balancing these two somehow.

I am still at the beginning of the road but the amount of new material I cover each day seems huge (I find a lot of new things for me) and it is growing.  That’s why in a single post I will focus on one main topic or idea, so after two or three hours of learning one day, I may have material for several posts over the next days.

After each post I will upload my code to Google Drive so that you can easily download it and play with it (when I start doing more advanced projects I will switch to GitHub) and I have the history of all the code I have written sice the beginning of my Android development journey.

That’s enough for the intro and organizational info. Let’s now move to DAY 3 where we will talk a bit about View Groups in Android.

What View Groups In Android Are

In my previous post we talked about the three basic views in Android, i.e. I showed you TextView, ImageView and Button elements. I also coded my first TextView and ImageView (I hope you did that too).

Since any app (except for the simple one-view apps we created) has multiple different views packed on the screen, our next step should be to learn about View Groups in Android, which is exactly the topic of this post.

You probably remember that we use Camel Case for names of elements in Android so to be precise we should call it the ViewGroup element. I see that people call it both View Groups and ViewGroups so I will use these two terms interchangeably.

So what are View Groups in Android and why would we use them?

  • A ViewGroup is in fact a type of a view which lets you put other views into it so that you can have several different views on the screen (not just one like we had in the examples from the previous post). We can also refer to it as a container for other groups. The word “container” should sound familiar if you have any experience with HTML and CSS.
  • A ViewGroup is also a rectangle on the screen (like in the case of ImageViews or TextViews) which can have different attributes like width, height or background color.
  • The content of a ViewGroup isn’t text or images, but simply other views that are contained within it. It’s a container for other views.

A View Group As A Root View

If we simply try to add a few different types of views on the screen (e.g. two TextViews), we will get an error saying that the XML document has more than one root view.

Views in Android

As you can see, in the Android Visualizer here I wanted to add three TextViews next to each other. Unfortunately, I encountered an error.

This is what we will get if you use the code below to have multiple views.

View-groups=in-android-error

This is not really what we might expect. 🙁

If we want to have multiple views in our app (and we, obviously, do), then we have to create a ViewGroup which will become the root view containing all other views. Let’s now learn more about the “family” relations between these different types of views.

Parents, Children & Siblings

Again, the family terminology probably rings a bell if you know anything about HTML and CSS. We also use it here to define the relations between different views in our app.

Parent

If a view contains other views in it, it is called a Parent of these views. Any container of views is also a parent of the views it contains. We can set the background of a parent to be transparent so we won’t see it (it will be an invisible parent) but it will still be there.

Child

Analogically, any view that is inside of a parent view is called a Child. When you begin to analyze apps, you will notice that there are way more children than parents in almost any app.

Siblings

If there is more than one child of a parent (and there usually are several children), we call them Siblings or simply sibling views.

View Groups in Android

Here I draw a very simple representation of relations in views in Android. As you can see, the parent view contains other children views in it.

A ViewGroup will usually be a parent of specific types of views, its children, e.g. TextViews,  ImageViews, Buttons and other

In theory it looks and seems extremely simple, but below you will find a small challenge I undertook.

Some Real-Life Examples Of View Groups In My Android Phone

My knowledge is still rather poor so I may make some mistakes (please correct me if I do) but, anyway, I reviewed the apps installed on my phone to find examples of view groups. Here is what I found.

View Groups in Android

These are the View Groups in my phone on the example of the Alarm Droid app.

And something from my favorite app for running.

View Groups in Android on the example of Endomondo app

Here are two screenshots from Endomondo. I hope that I named the relations between these views correctly.




Summary Of Day 3

Day 3 of my Android development journey has come to an end and I feel I learned a a lot and already gained some experience. I am also beginning to realize how much more there is still to learn.

Now I will continue with the Group Views and learn more about linear and relative layouts which I will discuss in next posts.

What I want to say: The journey of a thousand miles begins with a single step (and I have already taken three).
Level of motivation: Extremely high
Level of fatigue: Low (It’s Saturday and I feel fresh and relaxed after running 15 km).
Level of experience: 0.0020%
What I have learned: I know what View Groups in Android and I can recognize parents, children and siblings within view groups.

Share Your Thoughts

Are you an Android developer? Did you notice any errors in this post? Do you have any questions or comments?

I am only beginning my journey of becoming an Android developer and I would really like to hear from you (and learn form you). Feel free to either contact me directly or leave me your comments in the comment box below.

Add Comment