Linear layout is like a box that contains controls inside it. Controls are drawn one after each other either horizontally or vertically according to the Orientation of the layout.
When dealing with Linear layout there are five properties that we can deal with:
- Oientation.
- Fill model.
- Weight
- Gravity.
- padding.
Orientaition:Orientation property determines whether the controls would be put in a horizontal way like in a row or in a vertical way like a column. The layout orientation is set by the property android:orientation
Vertical orientation:
<button
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:text="this is a button 1"
/>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="this is a button 2"
/>
Horizontal Orientation
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="this is a button 1"
/>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="this is a button 2"
/>
If you want to set the orientation programmatically you can use this code
android.widget.LinearLayout mainLayout=new LinearLayout(this);
mainLayout.setOrientation(LinearLayout.VERTICAL);
Fill Model:The widgets inside linear layout have width and height properties. These properties can have three values:
- A numeric value in pixels or inches that gives the width or height properties an absolute value.
- They can have the value wrap_content meaning the widget should occupy it’s natural size unless there is no space then android can use word wrap to make the widget fit.
- They can have the value fill_parent meaning the widget should occupy all the available space of the closing container.
To set the fill model programmitaclly use this code:
Button b=(Button)findViewById(R.id.btn);
b.setWidth(LayoutParams.WRAP_CONTENT);
b.setHeight(LayoutParams.FILL_PARENT);
This is an example to two buttons one with width set to
fill_parent and the other set to
wrap_contentWeight:The weight property determines the ratio by which controls share free space. For example if we have two buttons and the weight of both is set to 1 (this is the default value) then the free space will be divided equally between them.
But if the value of the weight of one of them is 2 and the other is one, then the first button will occupy space half as that occupied by the second and so on.
<button
android:layout_height="fill_parent"
android:layout_weight="1"
android:layout_width="fill_parent"
android:text="weight set to 2"
/>
<button
android:id="@+id/btn"
android:layout_height="fill_parent"
android:layout_weight="1"
android:layout_width="fill_parent"
android:text="weight set to 1"
/>
To set the weight of a widget programmatically it’s a little bit different, we use this code:
Button b=(Button)findViewById(R.id.btn);
LayoutParams params=new android.widget.LinearLayout.LayoutParams(android.widget.LinearLayout.LayoutParams.FILL_PARENT,android.widget.LinearLayout.LayoutParams.FILL_PARENT,3);
b.setLayoutParams(params);
the widget does not have a method to set the weight directly, instead you define
LayoutParams params=new android.widget.LinearLayout.LayoutParams
object and use the widget. setLayoutParams(params) method.
The LayoutParams class has many constructors including this one
public LinearLayout.LayoutParams (int width, int height, float weight)
Gravity:By default widget are positioned in the top-left of the screen, but if you want to change this you can use the layout_gravity property
<button
android:layout_gravity="left"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="left">
/<button
android:layout_gravity="center"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="center"
/>
<button
android:layout_gravity="center_vertical" android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="center_vertical"
/>
<button
android:layout_gravity="center_horizontal" android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="center_horizontal"
/>
<button
android:layout_gravity="right"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="right"
/>
<button
android:layout_gravity="bottom"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="bottom"
/>
Or something like this
<button
android:layout_gravity="fill_vertical" android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="fill_vertical"
/>
<button
android:layout_gravity="fill_horizontal" android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="fill_horizontal"
/>
<button
android:gravity="right"
android:layout_gravity="clip_horizontal" android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="clip_horizontal"
/>
<button
android:gravity="top"
android:layout_gravity="clip_vertical" android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="clip_vertical"
/>
Notice that values
clip_horizontal and
clip_vertical are clear if only the
android:gravity property is defined. If this property is not defined then the control will be clipped on both edges.
When using
android:layout_gravity="clip_horizontal" with
android:gravity="right" the control’s left edge will be clipped and if the
android:gravity="left" the right edge will be clipped.
When using
android:layout_gravity="clip_vertical" with
android:gravity="top" the control’s bottom edge will be clipped and if the
android:gravity="bottom" the top edge will be clipped.
So what is the difference between the
android:layout_gravity and the
android:gravity properties:
The
android:layout_gravity sets the position of the view in the container, while
android:gravity sets the position of the content of the view.
For example if the
android:layout_gravity=”right” then the view would be placed in the right position in the container while if the view’s
android:gravity=”right” then the text of the view would be placed at the right.
To set the
android:gravity property programmatically you can use this code:
Button btn=(Button)findViewById(R.id.btn);
btn.setGravity(Gravity.RIGHT);
Padding:The
android:padding property sets the padding between widgets. if you specify the padding property to the container then the container with all of its widgets would be shifted by the value, if you specify it to a single widget then the contents of that widget would be shifted by the specified value.
If you use the
android:padding property then this would apply the padding values to the four edges of the widget. If you need to be more specific you can use :
android:paddingTop or
android:paddingLeft or
android:paddingRight or
android:paddingBottom
<button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="button 1"
/>
<button
android:id="@+id/btn"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:paddingleft="40px"
android:text="button 2"
/>
