Table Layout

Table Layout in android lets you arranges component in rows and columns, in the same way as HTML table layout works bye dividing it into <tr> and </td>.

Simple Program show the Table Layout

Step 1: Create a new Project
              File->New->Android Application Project.

Step 2: In Package Explorer Right Click on res/layout folder under your project
              Go to New->Android XML file->table_layout.xml (you can use any
                  name you wish).

Step 3: Open the newly created xml file(table_layout.xml) and write the below
              code.

  table_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#ffffff"
    android:shrinkColumns="*"
    android:stretchColumns="*" >

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#dcdcdc"
            android:gravity="center"
            android:text="Row 1"
            android:textSize="25sp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#b0b0b0"
            android:gravity="center"
            android:text="Row 1"
            android:textSize="25sp" />
    </TableRow>

    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#d3d3d3"
            android:gravity="center"
            android:text="Row 2"
            android:textSize="25sp" />
    </TableRow>

    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#cac9c9"
            android:gravity="center"
            android:text="Row 3"
            android:textSize="25sp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#b0b0b0"
            android:gravity="center"
            android:text="Row 3"
            android:textSize="25sp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#a09f9f"
            android:gravity="center"
            android:text="Row 3"
            android:textSize="25sp" />
    </TableRow>

</TableLayout>


Step 4: To set this new xml view as the intial view of your app.
            Go to MainActivity.java you will see setContentView(R.layout.activity_main) inside onCreate(). Change R.layout.activity_main to R.layout.table_layout.

MainActivity.java

package com.example.hello_world;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.table_layout);
    }
}

Step 5: Now to run the code Right Click on project->Run As-> 1.Android Application. You should see the newly created linear layout in emulator.