Android Programming Jumpstart - 3

This is part three in my series of quick tutorials to get you up and started programming Android applications. 
For this lab we will be looking more into XML defined layouts for your GUIs.





A common approach is to use an XML based file to layout the UI.

• Specifies the relationships of widgets with each other and their containers
• Very similar to laying out a webpage
• Located in res/layout – aka main.xml
• Your layout file will be a tree of XML elements

Elements attributes AKA properties specify the its look and behavior

• You can access these elements from your Java code

Similar to HTML/Javascript programming and you can use third party tools to create the UI layout.

• Eclipse and Motodev
• DroidDraw - http://www.droiddraw.org/
• WireframeSketcher - http://wireframesketcher.com/index.html
• Any text editor

Here is a project close to where we left off in part 2.

By the by – I have found that Eclipse can be twitchy if you try to run and the main.xml has focus in the IDE… 
My recommendation – don’t build or try to install from the IDE if an XML file has focus.


XML element attributes

• You won’t need to reference all your widgets in your Java code, but using an ID will allow you to do that  -  @+id/[your ID] – this creates a new ID resource
  
  • You can then access this later with View.findViewById() or Activity.findViewById()
• layout_width, layout_height
  
  • These can be used to specify the size of your widget. The value could be one of the constants below or an actual dimension. Available units are: px (pixels), dp (density-independent pixels), sp (scaled pixels based on preferred font size), in (inches), mm (millimeters).
  • FILL_PARENT – make the view wants to be as big as its parent minus padding
  • WRAP_CONTENT – make the view wants to be just big enough to enclose its content plus padding
• text
  
  • The text value you want displayed. This can be updated during runtime.
• Much more

SetContentView now uses our layout we defined in main.xml

Used findViewById to get the Button instance using the @+id value we defined

Used an anonymous inner class to override the onclick handler

The complete application – same as what we did in part 2.

In the next lab we will more into the widgets and how to use them.