Rajab Davudov - Android UI Design: Layouts

1. Rajab Davudov

2. What is a Layout ?
• A type of resource that defines what is
drawn on the screen.
• A type of View class whose primary
purpose is to organize other controls.

3. Why is a Layout ?
• More than 300 devices
with different
– Screen sizes and dimensions
– Screen densities
– Android versions
– OEM skins
– Control interfaces

4. Android Layouts
• LinearLayout
• RelativeLayout
• TableLayout
• FrameLayout
• AbsoluteLayout
• …

5. Linear Layout
In a linear layout, like the name suggests, all the elements are
displayed in a linear fashion(below is an example of the linear
layouts), either Horizontally or Vertically and this behavior is set
in android:orientation which is an attribute of the node
LinearLayout.
<LinearLayout android:orientation="vertical"> .... </LinearLayout>
OR
<LinearLayout android:orientation=“horizontal"> .... </LinearLayout>

6. Linear Layout

7. Relative Layout
In a relative layout every element arranges itself relative to other
elements or a parent element.
As an example, lets consider the layout defined below. The
“Cancel” button is placed relatively, to the right of the “Login”
button parallel. Here is the code snippet that achieves the
mentioned alignment (Right of Login button parallel)

8. Relative Layout

9. Table Layout
Table layouts in Android works in the same way HTML table
layouts work. You can divide your layouts into rows and columns.
Its very easy to understand. The image below should give you an
idea

10. Table Layout

11. Absolute Layout
Non-professional and not recommended layout !!!

12. Custom Layout Resource
• res/
– layout/
– layout-land/
– layout-xlarge-v11/
– layout-xlarge-land-v11/

13. Density Independent Pixels
• dp or dip

14. Ready, Steady, Code !!!

15. Rajab Davudov
Senior Developer at Azerfon
radjab@gmail.com
https://market.android.com/developer?pub=RADJAB
http://gplus.to/radjab
http://www.fb.me/rajab.davudov
http://www.linkedin.com/in/radjab
Market
QR Code