Creating Android UI using Views Layouts

Question 1

Describe layouts

Answer 1

● A layout defines the structure for a user interface in an application.
● All elements in the layout are built using a hierarchy of View and ViewGroup objects.

Question 2

Describe and illustrate views and view groups

Answer 2

A View usually draws something the user can see and interact with, whereas a ViewGroup is
an invisible container that defines the layout structure for View and other ViewGroup objects, all coming together to define a UI layout.

*See page 3 for illustration

Question 3

Describe view objects and give examples

Answer 3

● View objects are referred to as widgets.
● Widgets are any UI components that enable a
user view or manipulate an activity’s screen
● They include as scroll bars, buttons, textviews, selection boxes, pull-down menus, etc.

Question 4

Describe ViewGroup objects and give examples

Answer 4

● ViewGroup objects are referred to as layouts.
● Layouts include LinearLayout, GridLayout, RelativeLayout, etc.

Question 5

Describe the two ways of declaring layouts

Answer 5

Layouts can be declared in two ways (which could be used independently or together to
build an app):

– Using Android’s XML to declare UI elements
● Through XML code on layout editors under the layout
subfolder
● Through a drag-and-drop interface in the layout editor

– Instantiation of layout elements at runtime
● Creating View and ViewGroup objects programmatically

Question 6

Describe the hierarchy when declaring a layout using Android’s XML

Answer 6

● Each layout file must contain just one root element
(either a View or a ViewGroup object)
● Additional layout objects or widgets can then be added as
child elements to the root to build a View hierarchy that
defines a layout.
● Both the root element and the widgets have further children to describe various attributes to fit a certain layout requirement.

Question 7

Describe the process of loading an XML resource and the involved function

Answer 7

● When an app is compiled, each XML layout is compiled
into a View resource.
● The layout resource is loaded from the app code under the
Activity.onCreate() callback.
● The setContentView() function, which takes the reference
to the layout resource is used to facilitate the loading.
fun onCreate
(savedInstanceState: Bundle) {
super.onCreate(savedInstanceState)
setContentView(R.layout.main_layout)
}

Question 8

Describe XML attributes

Answer 8

● View and ViewGroups support their own diversity of XML attributes
● Some attributes may be specific to given View objects, but there are some common attributes that are common to all from the root View class, eg, the id attribute.

Question 9

Discuss the id attribute

Answer 9

id: This integer attribute identifies a View object
uniquely within a hierarchy/tree.

android:id=”@+id/my_button”
● The @ symbol indicates that the XML parser should parse and expand the rest of the id string and identify it as an ID
resource.
● The + means that the the component is a new resource name that must be created and added to our resources (R.java file).
● The other ID resources offered by the Android framework
should be referenced as follows to show reference of the ID
from the android.R resources and not the local R.java
resources:
android:id=”@android:id/empty”

Question 10

Write a code snippet to create an instance of an element
under the onCreate() callback:

Answer 10

val myButton: Button = findViewById(R.id.my_button)

Question 11

Describe layout parameters

Answer 11

● XML layout attributes define layout parameters for the View that are appropriate for the ViewGroup in which it resides.
● Every ViewGroup class implements a nested class that extends
ViewGroup.LayoutParams.
● This subclass contains property types that define the size and position for each child view, as appropriate for the view group.
● All view groups include a width and height (layout_width and layout_height), and each view is required to define them.

Question 12

What is the recommended approach to specify height and width

Answer 12

The recommended approach includes using wrap_content (size as required by a given content), match_parent (as big as a a parent may allow) or dp
(density independent pixels) to ensure consistency across device screen sizes.

Question 13

List view positions and dimensions

Answer 13

● A View has location (pair of left and top coordinates) expressed in pixels.
● A View also has two dimensions, expressed as a width and a height (expressed in pixels).

Question 14

What methods can be used to retrieve view locations

Answer 14

– getLeft() - Returns the x coordinate of the views rectangle
– getTop() - Returns the Y coordinate of the view rectangle
– getRight() - Returns coordinates of the right edge
– getBottom() - Retruns coordinates of the bottom edge

Question 15

What is the difference between measured width and height and actual width and height. Mention the functions associated with each

Answer 15

● The size of a view is expressed as a width and height
● Measured width and height define how big a view wants
to be with its parent, and can be obtained by calling
getMeasuredWidth() and getMeasuredHeight()
● Width and height define the actual view size on screen
and can be called by using getWidth() and getHeight()

Question 16

Explain and illustrate some common layouts

Answer 16

– Linear Layout- organizes its children into a single horizontal or vertical row

– Relative Layout- enables one to specify the location of child objects relative to each other
(child A to the left of child B) or to the parent (aligned to the top of the parent).

– Web View Layout- displays web pages.

*See 16-18 for illustrations

Question 17

When are layouts built using an adapter

Answer 17

When the content for your layout is dynamic or not pre-determined, one can use a layout that subclasses AdapterView to populate the
layout with views at runtime.

Question 18

Describe how the adapter works

Answer 18

● A subclass of the AdapterView class uses an Adapter to bind data to its layout.
● The Adapter behaves as a middleman between the data source and the AdapterView layout—the Adapter retrieves the data (from a source
such as an array or a database query) and converts each entry into a view that can be added into the AdapterView layout.

Question 19

What are the common layouts that are supported by adapters

Answer 19

– List view
– Grid view

Question 20

Explain how one can populate an adapterview

Answer 20

One can populate an AdapterView such as ListView or
GridView by binding the AdapterView instance to an Adapter, which retrieves data from an external source and creates a View that represents each data entry

Question 21

What are the most common types of adapters

Answer 21

– ArrayAdapter: This is used when a data source is an array. It creates a view for each array by calling toString()
– SimpleCursorAdapter: This adapter is used when data comes from a cursor. A layout for use for each row in the Cursor must be specified.

Question 22

How are click events handled in Android. Give an example

Answer 22

One can respond to click events on each item in an AdapterView by implementing the
AdapterView.OnItemClickListener interface, eg:

listView.onItemClickListener =
AdapterView.OnItemClickListener { parent,
view, position, id ­>
// Do something in response to the click
}