Scott Main | 50e990c | 2012-06-21 17:14:39 -0700 | [diff] [blame] | 1 | page.title=Linear Layout |
Scott Main | 64461bf | 2013-04-11 19:32:08 -0700 | [diff] [blame] | 2 | page.tags="linearlayout" |
Scott Main | 50e990c | 2012-06-21 17:14:39 -0700 | [diff] [blame] | 3 | @jd:body |
| 4 | |
| 5 | <div id="qv-wrapper"> |
| 6 | <div id="qv"> |
| 7 | <h2>In this document</h2> |
| 8 | <ol> |
| 9 | <li><a href="#Weight">Layout Weight</a></li> |
| 10 | <li><a href="#Example">Example</a></li> |
| 11 | </ol> |
| 12 | |
| 13 | <h2>Key classes</h2> |
| 14 | <ol> |
| 15 | <li>{@link android.widget.LinearLayout}</li> |
| 16 | <li>{@link android.widget.LinearLayout.LayoutParams}</li> |
| 17 | </ol> |
| 18 | </div> |
| 19 | </div> |
| 20 | |
| 21 | <p>{@link android.widget.LinearLayout} is a view group that aligns all children in a single |
| 22 | direction, vertically or horizontally. You can specify the layout direction with the |
| 23 | <a href="{@docRoot}reference/android/widget/LinearLayout.html#attr_android:orientation">{@code |
| 24 | android:orientation}</a> attribute.</p> |
| 25 | |
| 26 | <img src="{@docRoot}images/ui/linearlayout.png" alt="" /> |
| 27 | |
| 28 | <p>All children of a {@link android.widget.LinearLayout} are |
| 29 | stacked one after the other, so a vertical list will only have one child per |
| 30 | row, no matter how wide they are, and a horizontal list will only be one row |
| 31 | high (the height of the tallest child, plus padding). A {@link |
| 32 | android.widget.LinearLayout LinearLayout} respects <em>margin</em>s between children |
| 33 | and the <em>gravity</em> (right, center, or left alignment) of each child. </p> |
| 34 | |
| 35 | |
| 36 | <h2 id="Weight">Layout Weight</h2> |
| 37 | |
| 38 | <div class="sidebox-wrapper"> |
| 39 | <div class="sidebox"> |
| 40 | <h3>Equally weighted children</h3> |
| 41 | <p>To create a linear layout in which each child uses the same amount of |
| 42 | space on the screen, set the <a |
| 43 | href="{@docRoot}reference/android/view/ViewGroup.LayoutParams.html#attr_android:layout_height" |
| 44 | >{@code android:layout_height}</a> of each view to {@code "0dp"} (for a |
| 45 | vertical layout) or the <a |
| 46 | href="{@docRoot}reference/android/view/ViewGroup.LayoutParams.html#attr_android:layout_width" |
| 47 | >{@code android:layout_width}</a> of each view to {@code "0dp"} (for a |
| 48 | horizontal |
| 49 | layout). Then set the <a |
| 50 | href="{@docRoot}reference/android/widget/LinearLayout.LayoutParams.html#attr_android:layout_weight" |
| 51 | >{@code android:layout_weight}</a> of each view to {@code "1"}.</p> |
| 52 | </div> |
| 53 | </div> |
| 54 | |
| 55 | |
| 56 | <p>{@link android.widget.LinearLayout} also supports assigning a |
| 57 | <em>weight</em> to individual children with the <a |
| 58 | href="{@docRoot}reference/android/widget/LinearLayout.LayoutParams.html#attr_android:layout_weight" |
| 59 | >{@code android:layout_weight}</a> attribute. |
| 60 | This attribute assigns an "importance" value to a view in |
| 61 | terms of how much space is should occupy on the screen. A larger weight value allows it to expand |
| 62 | to fill any remaining space in the parent view. |
| 63 | Child views can specify a weight value, and then any remaining space in the view group is |
| 64 | assigned to children in the proportion of their declared weight. Default |
| 65 | weight is zero.</p> |
| 66 | |
| 67 | <p>For example, if there are three text fields and two of them declare a weight of 1, while the |
| 68 | other is given no weight, the third text field without weight will not grow and will only occupy the |
| 69 | area required by its content. The other two will expand equally to fill the space remaining after |
| 70 | all three fields are measured. If the third field is then given a weight of 2 (instead of 0), then |
| 71 | it is now declared more important than both the others, so it gets half the total remaining space, |
| 72 | while the first two |
| 73 | share the rest equally.</p> |
| 74 | |
| 75 | |
| 76 | <h2 id="Example">Example</h2> |
| 77 | |
| 78 | <div class="figure" style="width:220px;margin-top:0"> |
| 79 | <img src="{@docRoot}images/ui/sample-linearlayout.png" alt="" /> |
| 80 | </div> |
| 81 | |
| 82 | <pre> |
| 83 | <?xml version="1.0" encoding="utf-8"?> |
| 84 | <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" |
| 85 | android:layout_width="fill_parent" |
| 86 | android:layout_height="fill_parent" |
| 87 | android:paddingLeft="16dp" |
| 88 | android:paddingRight="16dp" |
| 89 | android:orientation="vertical" > |
| 90 | <EditText |
| 91 | android:layout_width="fill_parent" |
| 92 | android:layout_height="wrap_content" |
| 93 | android:hint="@string/to" /> |
| 94 | <EditText |
| 95 | android:layout_width="fill_parent" |
| 96 | android:layout_height="wrap_content" |
| 97 | android:hint="@string/subject" /> |
| 98 | <EditText |
| 99 | android:layout_width="fill_parent" |
| 100 | android:layout_height="0dp" |
| 101 | android:layout_weight="1" |
| 102 | android:gravity="top" |
| 103 | android:hint="@string/message" /> |
| 104 | <Button |
| 105 | android:layout_width="100dp" |
| 106 | android:layout_height="wrap_content" |
| 107 | android:layout_gravity="right" |
| 108 | android:text="@string/send" /> |
| 109 | </LinearLayout> |
| 110 | </pre> |
| 111 | |
| 112 | <p>For details about the attributes available to each child view of a {@link |
| 113 | android.widget.LinearLayout}, see {@link android.widget.LinearLayout.LayoutParams}.</p> |
| 114 | |
| 115 | |