如何使用TabHost(分頁)(deprecated)

如何使用TabHost(分頁)(deprecated)

新版方法

這種做法已經棄用了, 新版做法請參考如何使用Fragment建立TabActivity


以下已棄用 請仔細考慮

想要將很多個Activity做成很多分頁如下圖,
應該怎麼作呢?

其實只要使用TabHost就可以簡單的達成
首先我們在XML宣告一個TabHost

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TabHost 
        android:id="@android:id/tabhost"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">
            <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>
    </TabHost>
</LinearLayout>

上面那個是已經幫你做好的Tab排列,
如果你想要自訂屬於自己的Tab,可以研究一下裡面是怎麼組合的

再來就是將這個xml帶到activity裡面去呈現出來
記得這邊是繼承TabActivity

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);

    }
}

到目前為止, 還沒辦法呈現出Tab的效果(廢話 還沒開始寫啊)

接著我們加入一個函式addNewTab,用來增加我們的分頁
這個函式有兩個參數,一個是context另一個是要跳到另外一個分頁的activity

public void addNewTab(Class<?> cls, String tabName){
    Intent intent = new Intent().setClass(this, cls);
    TabHost.TabSpec spec = getTabHost().newTabSpec(tabName)
        .setIndicator(tabName)
        .setContent(intent);
    getTabHost().addTab(spec);
}

首先我們取得目前頁面的TabHost, 然後新增一個tabTabSpec
接著我們在設定Tab的圖示以及顯示的文字,使用setIndicator這個方法
最後我們把想要加入的Intent加入到這個Tab
這樣由Intent所指定的class就會跑進這個Tab裡面,
最後呼叫TabHost把這個分頁加進去

這時候我們假設想要寫入三個Tab
因此我們必須在Project裡面加入三個java檔案,
分別是Tab, TabTwo以及TabThree,

public class Tab extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
    }

}

public class TabTwo extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
    }

}

public class TabThree extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
    }

}

記得這邊要在manifest裡面加入

<activity android:name=".Tab1"></activity>
<activity android:name=".Tab2"></activity>
<activity android:name=".Tab3"></activity>

回到onCreate把這三個class加入到tab

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

    setContentView(R.layout.activity_main);
    addNewTab(Tab1.class, "Tab1");
    addNewTab(Tab2.class, "Tab2");
    addNewTab(Tab3.class, "Tab3");

    getTabHost().setCurrentTab(0);
    getTabHost().requestFocus();
}

並且把Tab設定為顯示第一個分頁, 因此傳入setCurrentTab(0)
執行看看 就可以看到一開始的畫面


Eclipse source