How To Develop And Control The Tabs In Android

This is a sample activity which shows How to create Tab Layout at bottom of the screen in android.

Underlying Algorithm:

Basic description of algorithm in step by step form:
1.) Create a project TabSample.
2.) Put the following code snippet in main.xml:

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"

        android:id="@android:id/tabhost"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
    <RelativeLayout
       android:orientation="vertical"
       android:layout_width="fill_parent"
       android:layout_height="fill_parent"
       android:padding="3dp">
       <FrameLayout
           android:id="@android:id/tabcontent"
           android:layout_width="fill_parent"
           android:layout_height="fill_parent"
           android:layout_weight="1" />
       <TabWidget
           android:id="@android:id/tabs"
           android:layout_width="fill_parent"
           android:layout_height="wrap_content"
           android:layout_alignBottom = "@android:id/tabcontent"
           />
    </RelativeLayout>
</TabHost>

3.) To create tab layout at bottom of the screen use the following in TabWidget in main.xml:

android:layout_alignBottom = "@android:id/tabcontent"

4.) For tab content create two more activities first OptionsActivity.java and second EditActivity.java.
5.) OptionsActivity.java will look like following:

package app.tabsample;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.Button;
import android.widget.TextView;

public class OptionsActivity extends Activity {
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        TextView t = new TextView(this);
        t.setText("text");
        setContentView(t);
    }
}

6.) EditActivity.java will look like following:

package app.tabsample;

import android.app.ListActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.AdapterView.OnItemClickListener;

public class EditActivity extends ListActivity {
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setListAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, mListContent)); 
    }
    private static String[] mListContent={"Item 1", "Item 2", "Item 3","Item 1","Item 2", "Item 3","Item 1", "Item 2", "Item 3","Item 1", "Item 2", "Item 3"};
}

7.) You must need to register these activities into your manifest file.Your manifest file will look like below:

<application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity android:label="@string/app_name" android:name=".TabSample">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".OptionsActivity"></activity>
        <activity android:name=".EditActivity"></activity>
 </application>

8.) Run the Application.

Steps to Create:

1.) Open Eclipse. Use the New Project Wizard and select Android Project Give the respective project name i.e. TabSample. Enter following information:
Project name: TabSample
Build Target: Google APIs
Application name: TabSample
Package name: app.TabSample
Create Activity: TabSample

On Clicking Finish TabSample code structure is generated with the necessary Android Packages being imported along with TabSample.java. TabSample class will look like following:

package app.tabsample;
import android.app.TabActivity;
import android.os.Bundle;
import android.widget.TabHost;
import android.content.Intent;

public class TabSample extends TabActivity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        TabHost tabHost = getTabHost();    
   
        tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("TEXT").setContent(newIntent(this, OptionsActivity.class)));
   
        tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("LIST").setContent(newIntent(this, EditActivity.class)));
        tabHost.setCurrentTab(1);
    }
}

Output –The final output: