Skip to content
{ 2010 01 05 }

Android Layout Tutorial

An Android layout is a class that handles arranging the way its children appear on the screen.  Anything that is a View (or inherits from View) can be a child of a layout. All of the layouts inherit from ViewGroup (which inherits from View) so you can nest layouts.  You could also create your own custom layout by making a class that inherits from ViewGroup.

The standard Layouts are:

AbsoluteLayout
FrameLayout
LinearLayout
RelativeLayout
TableLayout

In this article we will examine each of these layouts in detail.

I have also created a demo project that uses the code samples from this tutorial and from the Lots of Lists: Part 1, Simple List Activity tutorial.
You can download the demo source code here.

Next: AbsoluteLayout

Pages: 1 2 3 4 5 6 7
Posted by Sheridan on Tuesday, January 5, 2010, at 10:31 pm. Filed under Beginner. Follow any responses to this post with its comments RSS feed. You can post a comment or trackback from your blog.

{ 67 } Comments

  1. Derrick | March 30, 2010 at 10:22 am | Permalink

    You have a very nice set of tutorials here! I am curious as to handling rotation of the physical device, such as the user effectively switching from portrait to landscape viewing of an application. Are there callbacks that are given, or queries that can be performed by us, as the developer, or is this automatic?

  2. Dave Germiquet | April 24, 2010 at 8:22 pm | Permalink

    Hi,

    This was a great tutorial and an easy read. I understand alot more on how google’s xml display/gui works.

    Thanks a bundle!

  3. jen | May 25, 2010 at 1:41 pm | Permalink

    Small typo here — the original code sample says ‘android:orientation=”horizontal”‘, but should say ‘android:orientation=”vertical”‘ instead.

  4. radhika | July 23, 2010 at 2:16 am | Permalink

    Helped me alot……as I am beginner as a professional….

  5. juan mendez | August 28, 2010 at 1:46 pm | Permalink

    I really liked your tutorial, and how easy it was to understand everything by explanation, graphic content and code. This helps tremendously. thanks. :)

  6. vins | August 31, 2010 at 4:00 am | Permalink

    Nice one..

  7. Ashok Parmar | August 31, 2010 at 5:39 am | Permalink

    Nice One :)

  8. Belarmino | September 3, 2010 at 8:03 am | Permalink

    I am learning Android and I hope this tutorial helps me.

  9. Gaurang talwadkar | September 9, 2010 at 12:08 am | Permalink

    This tutorial is really helpful and easy to understand.
    can you send me downloadable pdf file of this tutorial.

  10. Igor | September 22, 2010 at 2:19 pm | Permalink

    Thanks! RelativeLayout very very good.

  11. Hesam | October 31, 2010 at 10:50 am | Permalink

    Hi,

    Your goal is awesome. I read some articles and I’m sure you and your goal are the best.

    I’ll be happy if I can help you, although I’m beginner. ;)

    Warm Regards
    Hesam

  12. george | November 8, 2010 at 6:17 am | Permalink

    very nice& very useful to the begginers….. thanks lot….

  13. Afonso Lage | November 9, 2010 at 8:29 am | Permalink

    Great tutorial man. Thanks for sharing this information with us, i’m so glad becouse i found this.

  14. oxygenyoyo.com | November 15, 2010 at 10:52 pm | Permalink

    Your post is very good tutorial.
    so, I would like to ask you some question.

    I have to tell you before . I don’t know that is correct or not.

    Could I translate your post in thai language ?
    of cause , I will tell people that post where it come from ( credit ).

    if no, it’s ok for me. I still follow your blog : )

    thank you

  15. Alexey | December 26, 2010 at 1:54 pm | Permalink

    Excellent article! Thanks a lot!

  16. bella | February 17, 2011 at 2:16 am | Permalink

    simple :) easy to understand for first tutorial
    thanx!

  17. zainab | March 22, 2011 at 2:00 pm | Permalink

    there is much good information i like it :)

  18. Prasanna Kumar | March 29, 2011 at 8:28 am | Permalink

    Very nice!
    Its always good to understand things with examples.

  19. ruchi kumari | March 29, 2011 at 11:41 pm | Permalink

    Hi,
    Nice tutorial.
    I want one label, one edittext and one button horizontally.
    My requirement is on changing the screen size, my label and button size should be fix but my edittext should be flexible.
    I mean that if we increase window size then only the edittext box size should change to adjust the screen size.
    please help.
    Thanks.

  20. ajay patel | April 12, 2011 at 4:27 am | Permalink

    thanks… its helpful to me in my android appp

  21. Alok Tiwari | April 19, 2011 at 5:01 am | Permalink

    good explanation so thanks dear and try to provide the pdf or ppt

  22. Sebastien | April 25, 2011 at 4:04 pm | Permalink

    I wonder why the button is located in the first column and the text view of the “first name” and “last name” starts on the second column. It would be nice to explain a solution for that.

    Thanks for the tutorial.

  23. Sebastien | April 25, 2011 at 4:13 pm | Permalink

    Sorry, I thought my comment is associated to the TableLayout page only. This is in reference to the TableLayout.

    ”I wonder why the button is located in the first column and the text view of the “first name” and “last name” starts on the second column. It would be nice to explain a solution for that.”

    Also,there was another article that said that embedded LinearLayout is more cpu extensive than a single RelativeLayout. Can you comment on the efficiency of different layouts. It looks like TableLayout is more straight forward than RelativeLayout but does it cost more than LinearLayout?

  24. mukla.c | May 6, 2011 at 4:27 am | Permalink

    thnx……….
    good e,ample

  25. iler | May 14, 2011 at 4:31 am | Permalink

    Dite mois si sa marche

  26. adji | June 6, 2011 at 6:46 am | Permalink

    thanks buddy. it’s nice article about android. layout layout n layout :) if you need any ebook about android. please visit my blog http://free-ebook-collections.co.nr/ thanks

  27. Jilani | June 9, 2011 at 7:33 am | Permalink

    Very good.i like it

  28. Onur | June 20, 2011 at 12:53 am | Permalink

    hi, can we use this absolutelayout same as HTML CSS like just using x and y. can we use right/left and bottom/top.

    thanks.

  29. Jebel | June 20, 2011 at 1:22 am | Permalink

    Great! You resolve my problem. Thanks.

  30. Pramod | July 1, 2011 at 10:55 pm | Permalink

    Thanks for the lucid explanation! It is very helpful for a beginner like me .

  31. andbeg | July 5, 2011 at 11:44 pm | Permalink

    Thanks in advance for this knowledge

  32. Nixit | July 10, 2011 at 9:25 am | Permalink

    Thanks!!

  33. Victor | July 12, 2011 at 5:14 am | Permalink

    im new to android and i made a layout but it doesnt show the imagebuttons and text could you tell me why? Here it is:

  34. Dheeraj Bapat | July 20, 2011 at 10:46 pm | Permalink

    Thanks for very clear explanation.

  35. Ademar Oliveira | July 27, 2011 at 1:17 pm | Permalink

    Muito bom ^.^

    seria legal ter o código para fazer em java também ;)

  36. Pawel | July 28, 2011 at 9:16 am | Permalink

    Hello – I can’t understand why when I do it in emulator – every thing is on the top of the screen???? Please tell me – why on EARTH(!) my two buttons (“add” and “print”) appears always on the top of the screen overlapping gallery view?? Why this has to be so painful???? I just set the gravity to “TOP” for gallery and to “BOTTOM” for those two buttons in tablelayout, as you can see in my xml code. what the heck is that???? Below is my XML:

  37. Jai prakash | August 8, 2011 at 6:41 am | Permalink

    nice

  38. Edward Walker | August 15, 2011 at 9:23 am | Permalink

    Great stuff it help you with a good starting point UI layouts…thanks much!!

  39. riper | August 16, 2011 at 2:54 pm | Permalink

    Great tutorial! Thanks for sharing your knowledge!

    Cheers
    riper

  40. anil changlani | September 20, 2011 at 10:41 pm | Permalink

    I want to know how to increase font size in Eclipse IDE

  41. ayrina | September 22, 2011 at 9:43 am | Permalink

    hello,

    thanks for giving such a great infromation..

    but whant to know which layour would bebeat for mt application taht it supports all my device sizes..
    Thanks,
    Ayrina

  42. vikash kuamr karn | September 26, 2011 at 4:52 am | Permalink

    I found this site very helpful…. very concise yet informative

  43. Kala | October 5, 2011 at 2:28 pm | Permalink

    Thanks man.. this helps a lot :)

  44. Thankful Developer | October 28, 2011 at 11:26 am | Permalink

    Thank you very much,
    this makes android layouting much easier,

  45. kARAN | October 31, 2011 at 8:22 am | Permalink

    very nice

  46. Sheridan | November 8, 2011 at 3:02 pm | Permalink

    Absolutely, feel free to translate it as long as you provide proper credit.

  47. Nadeem | November 18, 2011 at 3:42 am | Permalink

    Very nice tutorial i realy learn more from it

  48. Unnati | November 28, 2011 at 8:17 am | Permalink

    Hey Hi!!! You have given really nice exaple and so nicely explained everything.Just wanted to add that in linear layout output of horizontal orientation is given as output of vertical one’s. And thanks its was really helping to understand layouts.. :)

  49. Arshad Ali Soomro | December 10, 2011 at 3:29 pm | Permalink

    This one is great Keep going on!!

  50. Uggabugga | May 31, 2012 at 6:13 am | Permalink

    I’m sorry but don’t ever use PIXELS for Android…. fail

  51. Asif | June 1, 2012 at 12:57 am | Permalink

    Great article…very easy fully explained concepts. Thank you

  52. vikas | June 2, 2012 at 10:34 am | Permalink

    thanx a lot sir for this tutorial.. it was really help full.. with this tutorials beginner will defiantly feel android application is easy development.. :)

  53. Sachin | June 21, 2012 at 1:00 am | Permalink

    Awesome tutorial….thanks… keep posting….

  54. anton | June 23, 2012 at 8:21 pm | Permalink

    Great stuff – you nailed this one.

  55. omkar | July 5, 2012 at 5:06 am | Permalink

    good going man.. m fully satisfied…….

  56. Mike | July 5, 2012 at 12:22 pm | Permalink

    Good Tutorial!! Thank’s

  57. vivek | July 7, 2012 at 11:37 pm | Permalink

    Love to see how effectively and simply u make understood the layouts basic…great tutorial
    thanks a lot..

  58. Vikash | July 11, 2012 at 12:48 am | Permalink

    This is the most stunning layout tutorial I ever read…thanx man….very good

  59. alterego | July 19, 2012 at 8:01 am | Permalink

    hello, this tutorial is a great one, keep going so that people like me can learn esear in these way…and by the way, I descovered recentley Sublime Text 2. it is very powerfull. I apologize for my english.Thanks!

  60. nock starett | July 19, 2012 at 8:21 am | Permalink

    This is really sweet of you………..thanks for the help

  61. KS NAYAKA | August 4, 2012 at 12:43 pm | Permalink

    thanks for info….it helped me a lot

  62. John | August 7, 2012 at 3:40 am | Permalink

    Cool one.. ! I just learned layouts now, whats next as a beginer?

  63. krishna | August 9, 2012 at 4:32 am | Permalink

    Great!!!! thanks a lot….

  64. Jason | August 20, 2012 at 10:22 pm | Permalink

    Thanks so much for the clear tutorial. I especially like how you provided a screenshot with each XML example.

    A bit miffed that layouts keep changing as technology progresses. The Android 3.2 way of layouts has me specifying resolutions in the layout structure.

    res/layout/main_activity.xml # For phones
    res/layout-sw600dp/main_activity.xml # For 7” tablets
    res/layout-sw720dp/main_activity.xml # For 10” tablets

    Ah well… thanks again for the jump start into understanding the different types of layouts.

  65. venkat | August 24, 2012 at 1:01 am | Permalink

    I got a lot of content from this tutorial. I expected u to provide same kind of tutorials in further

  66. Alexandre Verri | August 28, 2012 at 1:15 am | Permalink

    Great given explanation, keep it up dude… ty a bunch

  67. parmar nitesh | August 29, 2012 at 12:39 am | Permalink

    nice ….

{ 3 } Trackbacks

  1. Create Android Interfaces | May 11, 2010 at 11:32 am | Permalink

    [...] learn Android you can find also a great resources for how to use Android AbsoluteLayout, FrameLayout, [...]

  2. Android Layout Tutorial | developersmania | September 12, 2011 at 5:49 am | Permalink

    [...] AbsoluteLayout FrameLayout LinearLayout RelativeLayout TableLayout [...]

  3. android tips im using | imjeee | Jie Lian blog | May 24, 2012 at 10:13 pm | Permalink

    [...] layout tutorial http://www.learn-android.com/2010/01/05/android-layout-tutorial/4/ [...]

Post a Comment

Your email is never published nor shared. Required fields are marked *