- Android Application Overview - Activity Lifecycle - Basic Android User Interface components - Layouts - XML Layout Attributes - Dimensions

1. Android - Lesson 2
Daniela da Cruz
Universidade Lusófona do Porto
September, 2012
1 of 35

2. Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
2 of 35

3. Layout
Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
3 of 35

4. Android Application Overview
An Android application consists of various functionalities. Some
examples are editing a note, playing a music file, ringing an alarm, or
opening a phone contact.These functionalities can be classified into
four different Android components:
Every application is made up of one or more of these components.
4 of 35

5. Layout
Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
5 of 35

6. Activity Lifecycle
6 of 35

7. Activity Lifecycle
Note the following:
• Changing the screen orientation destroys and recreates the activity
from scratch.
• Pressing the Home button pauses the activity, but does not destroy
it.
• Pressing the Application icon might start a new instance of the
activity, even if the old one was not destroyed.
• Letting the screen sleep pauses the activity and the screen
awakening resumes it. (This is similar to taking an incoming phone
call.)
7 of 35

8. Layout
Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
8 of 35

9. Activity
An Activity represents the visual representation of an Android
application.
Activities use Views and Fragments to create the user interface and
to interact with the user.
An Android application can have several Activities.
9 of 35

10. Fragments
Fragments are components which run in the context of an Activity.
Fragment components encapsulate application code so that it is easier
to reuse it and to support different sized devices.
Fragments are optional, you can use Views and ViewGroups directly in
an Activity but in professional applications you always use them to
allow the reuse of your user interface components on different sized
devices.
10 of 35

11. View and ViewGroup
Views are user interface widgets, e.g. buttons or text fields. Views
have attributes which can be used to configure their appearance and
behavior.
A ViewGroup is responsible for arranging other Views. ViewGroups is
also called layout managers.
ViewGroups can be nestled to create complex layouts. You should not
nestle ViewGroups too deeply as this has a negative impact on the
performance.
11 of 35

12. View and ViewGroup
The user interface for each component of your app is defined using a
hierarchy of View and ViewGroup objects.
The easiest and most effective way to define a layout is with an XML
file.
12 of 35

13. Layout
Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
13 of 35

14. Layouts
An Android layout is a class that handles arranging the way its
children appear on the screen. Anything that is a View (or inherits
from View) can be a child of a layout. All of the layouts inherit from
ViewGroup (which inherits from View) so you can nest layouts.
The standard Layouts are:
• AbsoluteLayout
• FrameLayout
• LinearLayout
• RelativeLayout
• TableLayout
14 of 35

15. AbsoluteLayout (deprecated)
AbsoluteLayout is based on the simple idea of placing each control at
an absolute position. You specify the exact x and y coordinates on
the screen for each control.
15 of 35

16. FrameLayout
FrameLayout is designed to display a single item at a time. You can
have multiple elements within a FrameLayout but each element will be
positioned based on the top left of the screen. Elements that overlap
will be displayed overlapping.
16 of 35

17. LinearLayout
LinearLayout is a view group that aligns all children in a single
direction, vertically or horizontally.
You specify whether that line is vertical or horizontal using
android:orientation.
17 of 35

18. RelativeLayout (1)
RelativeLayout lays out elements based on their relationships with one
another, and with the parent container. RelativeLayout is very
powerful but the most complicated one, and we need several
properties to actually get the layout we want.
18 of 35

19. RelativeLayout (2)
These properties will layout elements relative to the parent
container:
• android:layout_alignParentBottom — Places the bottom of
the element on the bottom of the container.
• android:layout_alignParentLeft — Places the left of the
element on the left side of the container.
• android:layout_alignParentRight — Places the right of the
element on the right side of the container.
• android:layout_alignParentTop — Places the element at the
top of the container.
19 of 35

20. RelativeLayout (3)
(cont.)
• android:layout_centerHorizontal — Centers the element
horizontally within its parent container.
• android:layout_centerInParent — Centers the element both
horizontally and vertically within its container.
• android:layout_centerVertical — Centers the element
vertically within its parent container.
20 of 35

21. RelativeLayout (4)
These properties allow you to layout elements relative to other
elements on screen.
• android:layout_above — Places the element above the specified
element.
• android:layout_below — Places the element below the specified
element
21 of 35

22. RelativeLayout (5)
(cont.)
• android:layout_toLeftOf — Places the element to the left of
the specified element.
• android:layout_toRightOf — Places the element to the right of
the specified element.
The value for each of these elements must be a reference to another
resource, in the form “@[+][package:]type:name”.
22 of 35

23. RelativeLayout (6)
These properties allow you to specify how elements are aligned in
relation to other elements.
• android:layout_alignBaseline — Aligns baseline of the new
element with the baseline of the specified element.
• android:layout_alignBottom — Aligns the bottom of new
element in with the bottom of the specified element.
• android:layout_alignLeft — Aligns left edge of the new
element with the left edge of the specified element.
23 of 35

24. RelativeLayout (7)
(cont.)
• android:layout_alignRight — Aligns right edge of the new
element with the right edge of the specified element.
• android:layout_alignTop — Places top of the new element in
alignment with the top of the specified element.
24 of 35

25. RelativeLayout (8)
25 of 35

26. TableLayout
TableLayout organizes content into rows and columns. The rows are
defined in the layout XML, and the columns are determined
automatically by Android. This is done by creating at least one
column for each element.
26 of 35

27. Layout
Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
27 of 35

28. XML Layout Attributes
At compile time, references to the resources are gathered into an
auto-generated wrapper class called R.java. The Android Asset
Packaging Tool (aapt) autogenerates this file.
The syntax for an ID, inside an XML tag is:
android:id="@+id/my_button"
The at-symbol (@) at the beginning of the string indicates that the
XML parser should parse and expand the rest of the ID string and
identify it as an ID resource. The plus-symbol (+) means that this is a
new resource name that must be created and added to the R.java file.
28 of 35

29. XML Layout Attributes
When referencing an Android resource ID, you do not need the
plus-symbol, but must add the android package namespace, like so:
android:id="@android:id/empty"
With the android package namespace in place, we’re now referencing
an ID from the android.R resources class, rather than the local
resources class.
29 of 35

30. Layout
Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
30 of 35

31. Dimensions
A dimension is specified with a number followed by a unit of measure.
The following units of measure are supported by Android:
• dp — Density-independent Pixels: An abstract unit that is based on
the physical density of the screen. These units are relative to a 160
dpi (dots per inch) screen, on which 1dp is roughly equal to 1px.
When running on a higher density screen, the number of pixels used
to draw 1dp is scaled up by a factor appropriate for the screen’s dpi.
• sp — Scale-independent Pixels: This is like the dp unit, but it is
also scaled by the user’s font size preference.
• pt — Points: 1/72 of an inch based on the physical size of the
screen.
31 of 35

32. Dimensions
(cont.)
• px — Pixels: Corresponds to actual pixels on the screen. This unit
of measure is not recommended because the actual representation
can vary across devices.
• mm — Millimeters: Based on the physical size of the screen.
• in — Inches: Based on the physical size of the screen.
32 of 35

33. Layout
Android Application Overview
Activity Lifecycle
Basic Android User Interface components
Activity
Fragments
View and ViewGroup
Layouts
XML Layout Attributes
Dimensions
Exercise
33 of 35

34. Exercise
Create your first Android application to understand the activity
lifecycle.
You should display a message as soon as an event (onCreate,
onStart, etc) is fired.
To display messages use the class android.widget.Toast.
34 of 35

35. Slides made using the help of:
• http://developer.android.com/
• Programming Android. Zigurd Mednieks, Laird Dornin, G. Blake
Meike, Masumi Nakamura. O’Reilly Media. July 2011.
• The Android Developer’s Cookbook: Building Applications with the
Android SDK. James Steele, Nelson To.
• http://www.learn-android.com
35 of 35