Development Tutorial on Working with Layouts in Android

As I said before, the AbsoluteLayout main feature is that you can position the elements inside of it, with absolute coordinates. Absolute layouts are not very flexible and they are very hard to maintain: Imagine that you are working with a device (in my case I always work with my HTC Magic or HTC MyTouch in the USA), you create a screen with buttons, images and text and you position them using AbsoluteLayouts. You then create your application and you put it on the market. With time other Android mobiles appear, some with a screen larger than yours, some smaller. What will happen to your application on these phones? They will have problems displaying your screens because they will be dislocated. So take this into account, use them in the right way and in the right place, and combined with other Layout-elements.

To place an element inside an AbsoluteLayout, you have to put the following lines in it:

android:layout_x=”Xpx”

android:layout_y=”Ypx”

Example

<Button android:id="@+id/button"

android:layout_width="wrap_content" android:layout_height="wrap_content"

android:layout_x="115px"

android:layout_y="128px">

</Button>

It really is that easy.

RelativeLayouts are more complex to work with from my point of view, but they are well worth the effort. First we need to have a very clear idea of how the elements of the screen are going to be displayed.

Let's have a look at some of the most important attributes we can use in a widget to place it in a RelativeLayout.

android:layout_alignLeft = “@+id/widget”

android:layout_alignTop = “@+id/widget”

android:layout_alignBottom = “@+id/widget”

android:layout_alignRight = “@+id/widget”

Using the layout_align attribute, we are making the left/top/bottom/right edge of this view match the left/top/bottom/right edge of the given anchor view ID.

android:layout_alignParentLeft=”true|false”

android:layout_alignParentTop=”true|false”

android:layout_alignParentBottom=”true|false”

android:layout_alignParentRight=”true|false”

Using the layout_alignParent attributes, with the true or false value, we place the view at the left/top/bottom/right of its parent.

android:layout_below=”@+id/widget”

android:layout_above=”@+id/widget”

With this parameter we can place a view above or below another we specify in the value.

Hint!-> Views relationship are evaluated "in one pass", so, to assure your screen works how you want, if View A depends on view B, put B before A in the layout.

As we have seen, the RelativeLayout attributes are more complex, but they assure us the best way to display elements in the screen, without thinking of screen sizes. But AbsoluteLayouts are useful too! Don't stop using both of them.

In real applications, do we use just RelativeLayouts or AbsoluteLayouts? Of course not, they are always mixed and they live with LinearLayouts, TableLayouts etc...

Hopefully you now know a bit more about user interface design. Good luck and feel free to ask me questions.

Hint!-> Very important!! Some days ago, Google declared the AbsoluteLayout element is deprecated. It means that in future versions of the SDK it will not be available!!!! Better not to use it!