Home Tutorials Hints & Tips

Getting Started in Android Development

Part 4 - The Linear Layout

There are really two fundamental layouts that you would choose to create a screen. These are the Linear Layout and the Relative Layout. The Relative Layout is more complex to deal with, but provides you with a great deal of customization and precision. The Linear Layout is easy to work with, but gives you less control compared to the Relative Layout. The Relative Layout will be covered in a later tutorial.

Therefore, to start with I replaced the “RelativeLayout” XML tag with “LinearLayout”. This converts the layout to the LinearLayout form. I added an attribute that made the orientation vertical. This means that views will appear one below the other. The order they appear matches the top down appearance in the XML text. If I changed the orientation to horizontal, then view will appear side by side from left to right. The width and height attributes of “match_parent” means that the layout is as high and wide as its parent. Its parent in this case is the screen.

What is a View?

A view is simply the visible object we place in the layout to perform a task. A “TextView” will display some text. An “EditText” is a field that will allow us to enter some text. A button is just that. There are many more types of views e.g. sliders, progress bars, images etc. It is worth taking some time to familiarize yourself with these in Android studio and we will work with many more later on. One final noteworthy point is that text attributes have been added statically at this point, e.g. “combine” for the button.

In our example we simply added four views. The first two are EditText views that we will use to enter first and last names, the third is a button that when clicked will combine the two names and print the result in the TextView. Each view has an ID defined by the “android:id="@+id/” attribute. This ID is important as it is used by the Java code to link the view to it Java counterpart. The width attribute “match_parent” means that the width will be as wide as its parent view. Its parent the Linear Layout itself and that is as wide as the screen. The height attribute of “wrap_content” means it will wrap the height of any text entered.

After this tutorial you should have a layout file similar to that below. It is worth noting that layouts and any type can be nested and vertical and horizontal orientation can be used in combination to provide more sophisticated screens. Bear in mind that the more complex a layout is, the more processing time is needed to render the screen.

Download Download tutorial set 1

Privacy and Cookies Disclaimer Copyright
© 2015 - 2018 North Border Tech Training All rights reserved