TabWidget in Android (Basic)

Today we will try Tab-Widget in Android , using we can develop Tab Bar apps.

Displays a list of tab labels representing each page in the parent's tab collection. The container object for this widget is TabHost .


We will create very simple app to do this work..

 -------------------------------------------
App Name: TabWidgetBasic
Package Name: com.rdc
Android SDK: Android SDK 2.3.3 / API 10
Default TabActivity Name: ActivityTabWidget
-------------------------------------------


ActivityTabWidget.java

package com.rdc;

import android.app.TabActivity;
import android.os.Bundle;
import android.widget.TabHost;

public class ActivityTabWidget extends TabActivity {

 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);
  TabHost mTabHost = getTabHost();

  mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB 1")
    .setContent(R.id.textview1));
  mTabHost.addTab(mTabHost.newTabSpec("tab_test2").setIndicator("TAB 2")
    .setContent(R.id.textview2));
  mTabHost.addTab(mTabHost.newTabSpec("tab_test3").setIndicator("TAB 3")
    .setContent(R.id.textview3));

  mTabHost.setCurrentTab(0);
  }
}

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">
 <LinearLayout
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:gravity="bottom">
  <TabWidget
   android:id="@android:id/tabs"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"></TabWidget>
  <FrameLayout
   android:id="@android:id/tabcontent"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent">
   <TextView
    android:id="@+id/textview1"
    android:layout_height="fill_parent"
    android:layout_width="fill_parent"
    android:text="this is a tab"></TextView>
   <TextView
    android:id="@+id/textview2"
    android:layout_height="fill_parent"
    android:layout_width="fill_parent"
    android:text="this is another tab"></TextView>
   <TextView
    android:id="@+id/textview3"
    android:layout_height="fill_parent"
    android:layout_width="fill_parent"
    android:text="this is a third tab"></TextView>
  </FrameLayout>
 </LinearLayout>
</TabHost>

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest
 xmlns:android="http://schemas.android.com/apk/res/android"
 package="com.rdc"
 android:versionCode="1"
 android:versionName="1.0">
 <uses-sdk android:minSdkVersion="10" />

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

 </application>
</manifest>

The app will start like this..

You can download the complete source code zip file here : TabWidgetBasic

 cheers!!

 I'd love to hear your thoughts!