Android Tutorial Android Tutorial Part I

View the Project on GitHub FatFractal/hoodyoodoo

Add Tabs

For our app, we choose to organize the content using the TabActivity class. As a first step, we'll create the layout file, main.xml. Create the layout file in your layout directory, and enter the following code:

<?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>

The layout should look something like this:

Next, we need to create a new Activity. Create a new file, HoodyoodooActivity.java. As always, we first enter the package name and necessary imports:

package com.hoodyoodoo.droidapp.activity;

import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.util.Log;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;
import com.hoodyoodoo.droidapp.R;

Next, we declare the class itself. We will initially create a view with two tabs, so we'll also declare some constants to aid us:

public class HoodyoodooActivity extends TabActivity {
    public static final String TAB_WOULDYA_TAG     = "WouldYa";
    public static final String TAB_ADD_CELEB_TAG   = "AddCelebrity";
}

In the class we just created, we override the onCreate method. This is where the action happens:

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

    // Tab for WouldYa
    TabSpec wouldYaSpec = tabHost.newTabSpec(TAB_WOULDYA_TAG);
    wouldYaSpec.setIndicator("WouldYa", getResources().getDrawable(R.drawable.icon_wouldya_tab));
    Intent wouldYaIntent = new Intent(this, WouldYaActivity.class);
    wouldYaSpec.setContent(wouldYaIntent);

    // Tab for Add Celebrity
    TabSpec addCelebritySpec = tabHost.newTabSpec(TAB_ADD_CELEB_TAG);
    addCelebritySpec.setIndicator("AddCelebrity", getResources().getDrawable(R.drawable.icon_celebrity_tab));
    Intent addCelebrityIntent = new Intent(this, CelebrityActivity.class);
    addCelebritySpec.setContent(addCelebrityIntent);

    // Adding all TabSpec to TabHost
    tabHost.addTab(wouldYaSpec);
    tabHost.addTab(addCelebritySpec);
}

Finally, we need to add the action to AndroidManifest.xml. Add the following to the application element:

<activity
    android:name="com.hoodyoodoo.droidapp.activity.HoodyoodooActivity"
    android:label="@string/app_name" >
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>

NEXT: Storing a Celebrity Object