Android LinearLayout Example

If we use more than 1 widget on android programming we should use layout management to managae the UI (user interface) of all widgets. Layout management also called viewgroup, and widgets placed in layout management called view. LinearLayout is one of the layout managements of android programming, it displays every widget as horizontal or vertical position, LinearLayout has 5 base configurations, Orientation, Fill Model, Weight, Gravity, and Padding.

Orientation, used to display the layout as horizontal or vertical position, syntax:

android:orientation="value [horizontal | vertical]"

Fill Model, used to set view of widget elements against available space of layout, it has 3 options:

1. specific dimension, like 125dp.
2. wrap_content,  natural space concept.
3. fill_parent, widget will use a whole available space.

Weight, used to set width and height of layout

Gravity, by default LinearLayout is set to "Left and top aligned". Use the following values to use different gravity.

• left 
• center_horizontal
• right for left-aligned
• centered
• right-aligned

Padding, it has 4 base values, paddingleft, paddingright, paddingtop, and paddingbottom.

Here's the sample code to use LinearLayout in android programming.

• XML layout (/res/layout/{file}.xml)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >
    
    <RadioGroup 
        android:id="@+id/orientation"
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="5dp">
        
        <RadioButton 
            android:id="@+id/horizontal"
            android:text="@string/rb1"/>
        <RadioButton 
            android:id="@+id/vertical"
            android:text="@string/rb2"/>
    </RadioGroup>
    
    <RadioGroup 
        android:id="@+id/gravity"
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="5dp">
        
        <RadioButton 
            android:id="@+id/left"
            android:text="@string/rb3"/>
        <RadioButton 
            android:id="@+id/center"
            android:text="@string/rb4"/>
        <RadioButton 
            android:id="@+id/right"
            android:text="@string/rb5"/>
    </RadioGroup>

</LinearLayout>

• XML values (/res/values/strings.xml)

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">Linear layout</string>
    <string name="action_settings">Settings</string>
    <string name="rb1">Horizontal</string>
    <string name="rb2">Vertical</string>
    <string name="rb3">Left</string>
    <string name="rb4">Center</string>
    <string name="rb5">Right</string>

</resources>

• Java file (/src/{package}/{file}.java)

package first.linear_layout;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.Gravity;
import android.widget.LinearLayout;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;

public class MainActivity extends Activity implements OnCheckedChangeListener {

 private RadioGroup orientation, gravity;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  
  orientation = (RadioGroup)findViewById(R.id.orientation);
  orientation.setOnCheckedChangeListener(this);
  gravity = (RadioGroup)findViewById(R.id.gravity);
  gravity.setOnCheckedChangeListener(this);
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.main, menu);
  return true;
 }

 @Override
 public void onCheckedChanged(RadioGroup group, int checkedId) {
  // TODO Auto-generated method stub
  switch(checkedId){
  case R.id.horizontal:
   orientation.setOrientation(LinearLayout.HORIZONTAL);
   break;
  case R.id.vertical:
   orientation.setOrientation(LinearLayout.VERTICAL);
   break;
  case R.id.left:
   gravity.setGravity(Gravity.LEFT);
   break;
  case R.id.center:
   gravity.setGravity(Gravity.CENTER_HORIZONTAL);
   break;
  case R.id.right:
   gravity.setGravity(Gravity.RIGHT);
   break;
  }
  
 }

}

Here's one of the output examples: