1. Mobile Computing With Android ACST 4550 Android Layouts

2. Android Layouts
Most Android projects that have GUIs that are built using the Layout editor use one of the following Layouts: RelativeLayout, LinearLayout, and TableLayout. Each of these layouts have attributes or properites that help you design certain types of GUIs. The attributes can be seen in the XML file for the layout with the word “android:” in front of them. These attributes are the standard Android attributes that you can control from XML or from within Java methods.

3. Android Layouts RelativeLayout
The RelativeLayout is the default layout when you are using the Layout editor, but it can be difficult to use because it tries to relate different components that are added to the layout to other components. The following are some of the key attributes used with the RelativeLayout:
layout_alignLeft
layout_alignRight
layout_alignTop
layout_alignBottom
These attributes cause an view component to be lined up with another view component either on its left, right, top or bottom.

4. Android Layouts LinearLayout
In a LinearLayout components are arranged in a row horizontally or in a column vertically. If there is not enough space, the ones on the end (right or bottom) may not show at all. More complex layouts can be constructed by putting horizontal LinearLayout’s inside vertical a LinearLayout or vice versa. The following attributes for this layout help with aligning:
orientation
layout_marginLeft
layout_marginRight
layout_marginTop
layout_marginBottom
The first of these attributes (orientation) determines if the LinearLayout is vertical or horizontal, but the other determine the left, right, top or bottom boundaries of any of the view components.

5. Android Layouts TableLayout
The TableLayout holds components in rows, and when used with the TableRow tag, it organizes the components into columns that line up with each other over different rows. If you place an view component inside a a TableLayout but outside of a TableRow tag, it will fill an entire row by itself without any columns being created. The following attributes are use for determining how much space goes in between the columns and rows:
layout_margin
layout_padding
The first of these attributes controls the space outside the border between components, and the second one controls the space inside the border.

6. Android Layouts Other Important Attributes
The following are other important attributes used in different types of layouts:
id the id to use to load the component in Java code
layout_width the width of a view component
layout_height the height of a view component
text the text that will appear within a view component
background the background color of a view component
textColor the text color of a view component
gravity how to justify a view component: left, right, center
textSize the text size of a view component
hint the grayed out text hint inside an EditText component
inputType the type of input allowed in an EditText component

7. Android Layouts Other Important Attributes
Note: match_parent (aka fill_parent which has been depricated since API 8) and wrap_content are two common values given for the layout_width and layout_height attributes, and they have the following meaning:
match_parent means that the view component should only be as big in that dimension as its parent (minus padding)
wrap_content means that the view component should be just big enough to enclose its content (plus padding)

8. Create the following Android App: AndroidSalutation Name your Activity: SalutationActivity

9. Create the following Strings in strings.xml
String Name: String Value
heading I want your name
helloMsStr Hello Ms.
helloMrStr Hello Mr.
firstNameStr What\'s your first name?
lastNameStr What\'s your last name?
genderStr What\'s your gender?
femaleStr Female
maleStr Male
salutationStr Salutation
firstNameHint Type First Name
LastNameHint Type Last Name

10. Create the following GUI using Strings in strings.xml

11. The Android Salutation App
After completing your View for the AndroidSalutation App using the Layout Editor, see if you got your String names right by loading in the strings.xml file you are given, and modify the names in your Layout Editor if you have any names that are wrong:
See strings.xml

12. The Android Salutation App
After completing your View for the AndroidSalutation App using the Layout Editor, implement the functionality of the app using the given SalutationActivity.java as your Controller.
See SalutationActivity.java

13. The Android Salutation App
After trying to get the right look and feel using the Layout Editor, next see how fast you can accomplish that using the given XML file.
See activity_salutation.xml