Android – simple Tab bar example

By -



Problem: How to display Tab bar in Android?

Android Tab bar example

Android Tab bar example


Solution:

main.xml

<?xml version="1.0" encoding="utf-8"?>
<TabHost
	android:id="@android:id/tabhost"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	xmlns:android="http://schemas.android.com/apk/res/android">

	<LinearLayout
		android:layout_width="match_parent"
		android:id="@+id/linearLayout1"
		android:layout_height="match_parent"
		android:orientation="vertical">

		<TabWidget
			android:layout_width="match_parent"
			android:layout_height="wrap_content"
			android:id="@android:id/tabs">
		</TabWidget>

		<FrameLayout
			android:layout_width="match_parent"
			android:layout_height="match_parent"
			android:id="@android:id/tabcontent">
		</FrameLayout>
	</LinearLayout>
</TabHost>

TabBarActivity.java

package com.technotalkative.tabbarexample;

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

public class TabBarActivityextends 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.TabSpec spec;
        Intent intent;

        intent = new Intent().setClass(this, FirstActivity.class);
        spec = tabHost.newTabSpec("First").setIndicator("First")
                      .setContent(intent);
        tabHost.addTab(spec);

        intent = new Intent().setClass(this, SecondActivity.class);
        spec = tabHost.newTabSpec("Second").setIndicator("Second")
                      .setContent(intent);
        tabHost.addTab(spec);

        intent = new Intent().setClass(this, ThirdActivity.class);
        spec = tabHost.newTabSpec("Third").setIndicator("Third")
                      .setContent(intent);
        tabHost.addTab(spec);

        intent = new Intent().setClass(this, FourthActivity.class);
        spec = tabHost.newTabSpec("Fourth").setIndicator("Fourth")
                      .setContent(intent);
        tabHost.addTab(spec);
    }
}

tab_test.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
    <TextView
    	android:id="@+id/txtDisplayedTab"
    	android:layout_width="fill_parent"
    	android:layout_height="fill_parent"
    	android:textAppearance="?android:attr/textAppearanceLarge"
    	android:text="TextView"
    	android:gravity="center|center_vertical">
    </TextView>

</RelativeLayout>

FirstActivity.java

package com.technotalkative.tabbarexample;

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

public class FirstActivity extends Activity
{
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tab_test);

		TextView txtView = (TextView) findViewById(R.id.txtDisplayedTab);
		txtView.setText("First Tab is Selected");
	}
}

SecondActivity.java

package com.technotalkative.tabbarexample;

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

public class SecondActivity extends Activity
{
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tab_test);

		TextView txtView = (TextView) findViewById(R.id.txtDisplayedTab);
		txtView.setText("Second Tab is Selected");
	}
}

AndroidManifest.xml

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

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

		<activity android:name="FirstActivity">
        </activity>

        <activity android:name="SecondActivity">
        </activity>

        <activity android:name="ThirdActivity">
        </activity>

        <activity android:name="FourthActivity">
        </activity>
    </application>
</manifest>



Paresh Mayani

Paresh Mayani is a lead android developer from India. Currently, He is Sr. Software engineer at InfoStretch Solutions Pvt. Ltd. He has been developing android apps since very 1st version i.e. Android 1.5, he says he has seen days and nights of Android history. He is the Head/Organizer of Google Developers Group (GDG), Ahmedabad

Loading Facebook Comments ...
Loading Disqus Comments ...