Android - Switching Activities with a Tab Layout
        Posted  
        
            by Bill Osuch
        on Geeks with Blogs
        
        See other posts from Geeks with Blogs
        
            or by Bill Osuch
        
        
        
        Published on Tue, 21 Dec 2010 15:26:14 GMT
        Indexed on 
            2010/12/21
            15:55 UTC
        
        
        Read the original article
        Hit count: 520
        
This post is based on the Tab Layout tutorial on the Android developers site, with some modifications. I wanted to get rid of the icons (they take up too much screen real estate), and modify the fonts on the tabs.
First, create a new Android project, with an Activity called TabWidget. Then, create two additional Activities called TabOne and TabTwo. Throw a simple TextView on each one with a message identifying the tab, like this:
public class TabTwo extends Activity {
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  TextView tv = new TextView(this);
  tv.setText("This is tab 2");
  setContentView(tv);
 }
}
And don't forget to add them to your AndroidManifest.xml file:
<activity android:name=".TabOne"></activity>
<activity android:name=".TabTwo"></activity>
Now we'll create the tab layout - open the res/layout/main.xml file and insert the following:
<?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">
  <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" />
 </LinearLayout>
</TabHost>
Finally, we'll create the code needed to populate the TabHost. Make sure your TabWidget class extends TabActivity rather than Activity, and add code to grab the TabHost and create an Intent to launch a new Activity:
   TabHost tabHost = getTabHost();  // The activity TabHost
   TabHost.TabSpec spec;  // Reusable TabSpec for each tab
   Intent intent;  // Reusable Intent for each tab
  
   // Create an Intent to launch an Activity for the tab (to be reused)
   intent = new Intent().setClass(this, TabOne.class);
Add the first tab to the layout:
   // Initialize a TabSpec for each tab and add it to the TabHost
   spec = tabHost.newTabSpec("tabOne");  
   spec.setContent(intent);  
   spec.setIndicator("Tab One");  
   tabHost.addTab(spec);
It's pretty tall as-is, so we'll shorten it:
  // Squish the tab a little bit horizontally
  tabHost.getTabWidget().getChildAt(0).getLayoutParams().height = 40;
But the text is a little small, so let's increase the font size:
  // Bump the text size up
  LinearLayout ll = (LinearLayout) tabHost.getChildAt(0);
  android.widget.TabWidget tw = (android.widget.TabWidget) ll.getChildAt(0);
  RelativeLayout rllf = (RelativeLayout) tw.getChildAt(0);
  TextView lf = (TextView) rllf.getChildAt(1);
  lf.setTextSize(20);
Do the same for the second tab, and you wind up with this:
@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        TabHost tabHost = getTabHost();  // The activity TabHost
        TabHost.TabSpec spec;  // Reusable TabSpec for each tab
        Intent intent;  // Reusable Intent for each tab
  
        // Create an Intent to launch an Activity for the tab (to be reused)
        intent = new Intent().setClass(this, TabOne.class);
        // Initialize a TabSpec for each tab and add it to the TabHost
        spec = tabHost.newTabSpec("tabOne");  
        spec.setContent(intent);  
        spec.setIndicator("Tab One");  
        tabHost.addTab(spec);
        // Squish the tab a little bit horizontally
        tabHost.getTabWidget().getChildAt(0).getLayoutParams().height = 40;
        // Bump the text size up
        LinearLayout ll = (LinearLayout) tabHost.getChildAt(0);
        android.widget.TabWidget tw = (android.widget.TabWidget) ll.getChildAt(0);
        RelativeLayout rllf = (RelativeLayout) tw.getChildAt(0);
        TextView lf = (TextView) rllf.getChildAt(1);
        lf.setTextSize(20);
  
        // Do the same for the other tabs
        intent = new Intent().setClass(this, TabTwo.class);
        spec = tabHost.newTabSpec("tabTwo");  
        spec.setContent(intent);  
        spec.setIndicator("Tab Two");
        tabHost.addTab(spec);
        tabHost.getTabWidget().getChildAt(1).getLayoutParams().height = 40;
        RelativeLayout rlrf = (RelativeLayout) tw.getChildAt(1);
        TextView rf = (TextView) rlrf.getChildAt(1);
        rf.setTextSize(20);
  
        tabHost.setCurrentTab(0);
    }
Save and fire up the emulator, and you should be able to switch back and forth between your tabs!
© Geeks with Blogs or respective owner