Saturday, April 30, 2011

Android Tabbed Layout with single activity.

In Android, the content for each tab in a Tab Layout can be implemented in one of two ways:
1. Use tabs to switch views within the same activity.
2. Use tabs to switch between different activities.
The tutorial in the Android documentation shows how to do it the 2nd way i.e use tabs to switch between activities but I couldnt find a reasonable example of the first case so I have created one and the contents for layout .xml file and the source .java files are given below.







Layout file
 <?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:padding="5dp">  
           <TabWidget android:id="@android:id/tabs"  
                android:layout_width="fill_parent"   
                android:layout_height="wrap_content"   
                />  
           <FrameLayout android:id="@android:id/tabcontent"  
                android:layout_width="fill_parent" android:layout_height="fill_parent"  
                android:padding="5dp">  
                <LinearLayout android:id="@+id/layoutTab1"  
                     android:orientation="vertical"   
                     android:layout_width="fill_parent"  
                     android:layout_height="fill_parent">  
                     <TextView android:layout_width="fill_parent"  
                          android:layout_height="wrap_content"   
                          android:text="this is tab1. you can add whatever controls you want inside this Linear layout." />  
                </LinearLayout>  
                <LinearLayout android:id="@+id/layoutTab2"  
                     android:orientation="vertical"   
                     android:layout_width="fill_parent"  
                     android:layout_height="fill_parent">  
                     <TextView android:layout_width="fill_parent"  
                          android:layout_height="wrap_content"   
                          android:text="this is tab2. you can add whatever controls you want inside this Linear layout." />  
                </LinearLayout>  
           </FrameLayout>  
      </LinearLayout>  
 </TabHost>  

Java Source File
 package com.example;  
 import android.app.TabActivity;  
 import android.content.res.Resources;  
 import android.os.Bundle;  
 import android.widget.TabHost;  
 public class ExampleTabLayout extends TabActivity {  
      @Override  
      public void onCreate(Bundle savedInstanceState) {  
           super.onCreate(savedInstanceState);  
           setContentView(R.layout.main);  
           res = getResources();  
           TabHost tabHost = getTabHost();  
           TabHost.TabSpec spec;  
           spec = tabHost.newTabSpec("status").setIndicator("Status").setContent(R.id.layoutTab1);  
           tabHost.addTab(spec);  
           spec = tabHost.newTabSpec("actionitems").setIndicator("Action Items").setContent(R.id.layoutTab2);  
           tabHost.addTab(spec);  
           tabHost.setCurrentTab(0);  
      }  
      protected Resources res;  
 }  

2 comments:

Ken said...

You are right about the lack of a non-activities example for tabhost. What you have here evidently works for you but something very similar is not working for me--can't tell from your code why yours works and mine doesn't, but I appreciate the post since it shows that it *can* work.

Pavan Deshpande said...
This comment has been removed by the author.