Android TabWidget Example

By: Unknown 0 comments

Android TabHost  provides a nice way to present multiple thing on a Single Screen. These  things are presented by Tabs.

In order to use tabs we need to set 2 things to Tab
1: Tab Indicator : Text to show on Tab,  done by  setIndicator("Tab Name");
2: TAB Content: The activity that will be opened when user selects/clicks particular tab, done by  setContent(activityObject);

main.xml

<?xml version="1.0" encoding="utf-8"?>

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
          android:id="@android:id/tabhost">
       
        <LinearLayout
                android:id="@+id/LinearLayout01"
                android:orientation="vertical"
                android:layout_height="fill_parent"
                android:layout_width="fill_parent">
              
                <TabWidget
                    android:id="@android:id/tabs"
                    android:layout_height="wrap_content"
                    android:layout_width="fill_parent">
                </TabWidget>
              
                <FrameLayout
                    android:id="@android:id/tabcontent"
                    android:layout_height="fill_parent"
                     android:layout_width="fill_parent">
                </FrameLayout>
              
        </LinearLayout>

</TabHost>

TabActivity.java

public class MainActivity extends TabActivity
{
            /** Called when the activity is first created. */
            @Override
            public void onCreate(Bundle savedInstanceState)
            {
                    super.onCreate(savedInstanceState);
                    setContentView(R.layout.main);

                    // create the TabHost that will contain the Tabs
                    TabHost tabHost = (TabHost)findViewById(android.R.id.tabhost);


                    TabSpec tab1 = tabHost.newTabSpec("First Tab");
                    TabSpec tab2 = tabHost.newTabSpec("Second Tab");
                    TabSpec tab3 = tabHost.newTabSpec("Third tab");

                   // Set the Tab name and Activity
                   // that will be opened when particular Tab will be selected
                    tab1.setIndicator("Tab1");
                    tab1.setContent(new Intent(this,Tab1Activity.class));
                  
                    tab2.setIndicator("Tab2");
                    tab2.setContent(new Intent(this,Tab2Activity.class));

                    tab3.setIndicator("Tab3");
                    tab3.setContent(new Intent(this,Tab3Activity.class));
                  
                    /** Add the tabs  to the TabHost to display. */
                    tabHost.addTab(tab1);
                    tabHost.addTab(tab2);
                    tabHost.addTab(tab3);

            }
} 

Tab1Activity.java

public class Tab1Activity  extends Activity
{
        @Override
        public void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            
            TextView  tv=new TextView(this);
            tv.setTextSize(25);
            tv.setGravity(Gravity.CENTER_VERTICAL);
            tv.setText("This Is Tab1 Activity");
            
            setContentView(tv);
        }
}

Tab2Activity.java

public class Tab2Activity  extends Activity
{
        @Override
        public void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            
            TextView  tv=new TextView(this);
            tv.setTextSize(25);
            tv.setGravity(Gravity.CENTER_VERTICAL);
            tv.setText("This Is Tab2 Activity");
            
            setContentView(tv);
        }
}

Tab3Activity.java

public class Tab3Activity  extends Activity
{
        @Override
        public void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            
            TextView  tv=new TextView(this);
            tv.setTextSize(25);
            tv.setGravity(Gravity.CENTER_VERTICAL);
            tv.setText("This Is Tab3 Activity");
            
            setContentView(tv);
        }
}