Welcome to Part 2 of this review of the Pluralsight course Android Layout Fundamentals by Chiu-Ki Chan.

Chiu-Ki is a mobile developer with a passion in speaking and teaching.

She runs a mobile development company, producing apps such as “Monkey Write” for learning Chinese writing and Heart Collage for snapping photos to stitch into a heart.

Android Layout Fundamentals is the 5th course in the Android Learning Path.

Also in this series:

Part 1 – Introduction
Part 2 – LinearLayout
Part 3 – RelativeLayout
Part 4 – FrameLayout
Part 5 – TableLayout
Part 6 – Choosing the Right Layout

LinearLayout

Overview

LinearLayout aligns its children in a single direction: either horizontal or vertical. We see an illustration of both of these.

LinearLayout allows us to put views on the screen one after another. We can also divide height or width by ratio as a strategy for handling different device screen dimensions.

Gravity

We already covered Gravity in the introductory module.

Here we see another example that appears differently to how you might think it should. We set layout_gravity=”bottom” but it displays at the top!

We have set the orientation of the LinearLayout to vertical, and in this situation we cannot override the vertical position using layout_gravity. We can only adjust the horizontal position.

Chiu-Ki explains that if we want to move the view to the bottom, we can either change the orientation to horizontal, or we can use the RelativeLayout.

Weight

We see a LinearLayout example with two views in it. In the first module we learned  three ways to specify dimensions:

• wrap_content
• match_parent
• set specific dp value

There is also another way to achieve this: by setting a weight:

android:layout_width="0dp"
android:layout_weight="1"

In this lesson we see the effect of giving both views different weights.

Then we see that when we set three views with equal weights, each takes up exactly a third of the space.

When we change the middle view to use “wrap_content” instead of weight, it gives the middle view as much width as it needs, and then shares the remaining space equally for the remaining two views.

We can use this mechanic to assign the remaining width of a single view. In an example with two views, the first view is given the minimum width needed to display “left”, and the other view takes up the remaining space.

Chiu-Ki also talks about Dummy views. The simple “View” view is just an empty rectangle. We can use in to position other views.

We could also use the weightSum parameter, which tells Android the value that the LinearLayout will sum up to. This achieves the effect that we want with less markup code.

Nested Layout

The look we want to achieve in this lesson is a textbox at the top with cancel and OK buttons underneath and on the right hand side.

We can accomplish this with two linear layouts, one of which is nested inside the other.

The outer LinearLayout has a vertical orientation, and the child LinearLayout has a horizontal orientation.

The gravity of the child layout is set to the right.

Continue to Part 3 – RelativeLayout