Scribd
Upload
22 views

191 Lecture 4

This document discusses Android layouts and how to specify them using XML. It covers common layouts like linear, relative, frame, and table layouts. It explains how layouts can be nested and how to import them. The document also demonstrates how to specify a layout in XML and access it from code by setting the content view and finding views by ID. It discusses the benefits of using XML for separation of presentation from code and recompiling just the XML. Finally, it provides an example of using a relative layout for more flexibility than nested linear layouts.

Uploaded by

dilipagarwal
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
22 views

191 Lecture 4

This document discusses Android layouts and how to specify them using XML. It covers common layouts like linear, relative, frame, and table layouts. It explains how layouts can be nested and how to import them. The document also demonstrates how to specify a layout in XML and access it from code by setting the content view and finding views by ID. It discusses the benefits of using XML for separation of presentation from code and recompiling just the XML. Finally, it provides an example of using a relative layout for more flexibility than nested linear layouts.

Uploaded by

dilipagarwal
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 18

Android Programming Lecture 4

9/14/2011

Layouts
Layouts are ViewGroups Common layouts: which are used to hold FrameLayout other Views
LinearLayout

Invisible Allow positioning of different elements Layouts can be nested inside of each other

TableLayout RelativeLayout Gallery


import android.widget.NAME;

http://developer.android.com/guide/topics/ui/layout-objects.html

Specifying Layouts in XML


It is very common to specify layouts in a text instead of code format For main activity, layout specified in res/layout/main.xml XML: Extensible Markup Language
Similar to HTML Markup tags (< >, opening, /closing), Attributes=Values (x=y), Content (text [rare actually]) Nesting

Specifying Layouts in XML


Code and XML approaches that generate the same interface In XML version, the two Buttons are Nested inside the LinearLayout (between <LinearLayout></LinearLayout>)

StopWatch: XML Layout


Layout width, height, and weight parameters set as previously written in code Other initial features of the Views can also be set, such as the initial text Ids are auto-generated and can be referenced in code
@+id/button1 means - Go to the ID resource - Add a new ID value for Button1

Tricky: 1) ids dont map to 0,1,2,3 2) weights in XML are integer strings, in code floats

The XML is compiled into resources The view resource created can auto-magically be inflated at runtime Can programmatically access other definitions, such as IDs, made in XML

Using the XML Spec in Code

To make use of XML specified layout in code:


Use the layout as your layout for the Activity:
Reference the layout Resource specified in the main.xml file setContentView(R.layout.main);

Access parts of layout by id:

Reference the id Resource, get View associated with that id button = (Button)findViewById(R.id.button1);

Using the XML Spec in Code

Why Use XML?


Separation of appearance (presentation) from actual meaningful state-changing code Can change interface without having to completely recompile Java code
Can just recompile XML View Resource is inflated at runtime

Speaking of XML: Applications and Activities


How does the Application know the initial Activity to call?
Stored in application manifest: AndroidManifest.xml
Managed by Eclipse for us

Indication that the activity is the first target

Speaking of XML: Applications and Activities


A manifest for an Application with two Activity components

RelativeLayout
A Layout where the location for Views that are added can be described:
Relative to other Views added (to the left of X) Relative to the RelativeLayout container (aligned to the container bottom)

Very flexible Suggested for use over nested LinearLayouts


More complex the nesting of a layout, the longer to inflate

RelativeLayout: Layout Parameters

Remember, two styles: Relative to some other view (layout_below) Relative to RelativeLayout container parent (alignParentLeft)

ClearingStopWatch: LinearLayout (Homework Review)

ClearingStopWatch: RelativeLayout (Homework Review)

ClearingStopWatch: RelativeLayout Exploiting Relative Controls


Why is this layout difficult with a linear layout?

ClearingStopWatch: RelativeLayout Exploiting Relative Controls


Why is this layout difficult with a linear layout? Would need to nest two layouts
Row of Buttons TextView

If row of Buttons uses horizontal LinearLayout, would be next to each other instead of pushed to borders of screen

ClearingStopWatch: RelativeLayout Exploiting Relative Controls

ClearingStopWatch: RelativeLayout XML

You might also like