從零開始學android<TabHost標籤組件.二十九.>

標籤：風飛雪未揚   從零開始學android   tabhost的使用   

TabHost主要特點是可以在一個視窗中顯示多組標籤欄的內容，在Android系統之中每個標籤欄就稱為一個Tab，而包含這多個標籤欄的容器就將其稱為TabHost，TabHost類的繼承結構如下所示：java.lang.Object   ? android.view.View     ? android.view.ViewGroup       ? android.widget.FrameLayout         ? android.widget.TabHost 
常用方法如下所示

1	public TabHost(Context context)	構造	建立TabHost類對象
2	public void addTab(TabHost.TabSpec tabSpec)	普通	增加一個Tab
3	public TabHost.TabSpec newTabSpec(String tag)	普通	建立一個TabHost.TabSpec對象
4	public View getCurrentView()	普通	取得當前的View對象
5	public void setup()	普通	建立TabHost對象
6	public void setCurrentTab(int index)	普通	設定當前顯示的Tab編號
7	public void setCurrentTabByTag(String tag)	普通	設定當前顯示的Tab名稱
8	public FrameLayout getTabContentView()	普通	返回標籤容器
9	public void setOnTabChangedListener(TabHost.OnTabChangeListener l)	普通	設定標籤改變時觸發

兩種方式實現TabHost
方式一：直接讓一個Activity程式繼承TabActivity類； 方式二：利用findViewById()方法取得TagHost組件，並進行若干配置；
第一種方式讓一個類繼承tabActivity
XMl檔案 配置需要在一個xml檔案中嵌套使用布局 來達到不同Tab中顯示不同的內容

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <LinearLayout        android:layout_marginTop="50dp"        android:id="@+id/login"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TableRow            android:id="@+id/tableRow1"            android:layout_width="match_parent"            android:layout_height="wrap_content" >            <TextView                android:id="@+id/textView1"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="帳號" />            <EditText                android:id="@+id/editText1"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:ems="10"                android:textSize="25sp" />        </TableRow>        <TableRow            android:id="@+id/tableRow2"            android:layout_width="match_parent"            android:layout_height="wrap_content" >            <TextView                android:id="@+id/textView2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="密碼" />            <EditText                android:id="@+id/editText2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:ems="10"                android:textSize="25sp" />        </TableRow>        <TableRow            android:id="@+id/tableRow3"            android:layout_width="match_parent"            android:layout_height="wrap_content" >            <Button                android:id="@+id/button1"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:text="取消" />            <Button                android:id="@+id/button2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:text="登入" />        </TableRow>    </LinearLayout>    <LinearLayout        android:layout_marginTop="50dp"        android:id="@+id/image"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <ImageView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@drawable/a2" />    </LinearLayout>    <LinearLayout        android:layout_marginTop="50dp"        android:id="@+id/timer"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TimePicker            android:layout_width="match_parent"            android:layout_height="wrap_content" />    </LinearLayout> <LinearLayout        android:layout_marginTop="50dp"        android:id="@+id/timer1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TimePicker            android:layout_width="match_parent"            android:layout_height="wrap_content" />    </LinearLayout>     <LinearLayout        android:layout_marginTop="50dp"        android:id="@+id/timer2"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TimePicker            android:layout_width="match_parent"            android:layout_height="wrap_content" />    </LinearLayout></LinearLayout>

JAVA檔案設定

package com.example.tabhost;import android.app.TabActivity;import android.os.Bundle;import android.view.LayoutInflater;import android.widget.TabHost;import android.widget.TabHost.TabSpec;public class MainActivity extends TabActivity {private TabHost tabHost;//初始化TabHost組件private int reslayout[] = { R.id.login, R.id.image, R.id.timer , R.id.timer1,R.id.timer2};//設定對應的額xml檔案private int images[]={R.drawable.cart,R.drawable.cloud,R.drawable.comment,R.drawable.gear,R.drawable.joystick};//設定顯示的標題檔案@SuppressWarnings("deprecation")@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);this.tabHost = super.getTabHost();//執行個體化TabHost組件// 取得LayoutInflater對象LayoutInflater.from(this).inflate(R.layout.linearlayout,//制定布局this.tabHost.getTabContentView(),//制定標籤增加的容器 true);for (int i = 0; i < reslayout.length; i++) {TabSpec myTab = tabHost.newTabSpec("tab" + i);// 定義TabSpecmyTab.setIndicator(null,getResources().getDrawable(images[i])) ;// 設定標籤myTab.setContent(this.reslayout[i]) ;// 設定顯示的組件this.tabHost.addTab(myTab) ;}}}

如下




使用設定檔設定。這種方法較為常見，可以講TabHost置於底部
但是布局檔案較為複雜，大家可以參照例子進行具體的學習
XML檔案

<?xml version="1.0" encoding="utf-8"?><TabHost xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/tabhost" android:orientation="vertical"android:layout_width="fill_parent" android:layout_height="fill_parent"><RelativeLayout 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"android:layout_alignParentBottom="true" /><FrameLayout android:id="@android:id/tabcontent"android:layout_width="fill_parent" android:layout_height="fill_parent">  <LinearLayout                android:id="@+id/login"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TableRow            android:id="@+id/tableRow1"            android:layout_width="match_parent"            android:layout_height="wrap_content" >            <TextView                android:id="@+id/textView1"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="帳號" />            <EditText                android:id="@+id/editText1"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:ems="10"                android:textSize="25sp" />        </TableRow>        <TableRow            android:id="@+id/tableRow2"            android:layout_width="match_parent"            android:layout_height="wrap_content" >            <TextView                android:id="@+id/textView2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="密碼" />            <EditText                android:id="@+id/editText2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:ems="10"                android:textSize="25sp" />        </TableRow>        <TableRow            android:id="@+id/tableRow3"            android:layout_width="match_parent"            android:layout_height="wrap_content" >            <Button                android:id="@+id/button1"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:text="取消" />            <Button                android:id="@+id/button2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:text="登入" />        </TableRow>    </LinearLayout>    <LinearLayout        android:id="@+id/image"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <ImageView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@drawable/a2" />    </LinearLayout>    <LinearLayout        android:id="@+id/timer"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TimePicker            android:layout_width="match_parent"            android:layout_height="wrap_content" />    </LinearLayout> <LinearLayout        android:id="@+id/timer1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TimePicker            android:layout_width="match_parent"            android:layout_height="wrap_content" />    </LinearLayout>     <LinearLayout        android:id="@+id/timer2"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical" >        <TimePicker            android:layout_width="match_parent"            android:layout_height="wrap_content" />    </LinearLayout></FrameLayout></RelativeLayout ></TabHost>

JAVA檔案配置

package com.example.tabhost;import android.os.Bundle;import android.app.Activity;import android.widget.TabHost;import android.widget.TabHost.TabSpec;public class MainActivity extends Activity {// 直接繼承Activityprivate TabHost myTabHost;// 定義TabHostprivate int[] layRes = { R.id.login, R.id.image , R.id.timer, R.id.timer1, R.id.timer2 };// 定義內嵌布局管理器IDprivate int images[]={R.drawable.cart,R.drawable.cloud,R.drawable.comment,R.drawable.gear,R.drawable.joystick};//標題圖片資料@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);super.setContentView(R.layout.activity_main) ;// 調用預設布局管理器this.myTabHost = (TabHost) super.findViewById(R.id.tabhost); // 取得TabHost對象this.myTabHost.setup() ;// 建立TabHost對象for (int x = 0; x < this.layRes.length; x++) {// 迴圈取出所有布局標記TabSpec myTab = myTabHost.newTabSpec("tab" + x);// 定義TabSpecmyTab.setIndicator(null,getResources().getDrawable(images[x])) ;// 設定標籤文字myTab.setContent(this.layRes[x]) ;// 設定顯示的組件this.myTabHost.addTab(myTab) ;// 增加標籤}this.myTabHost.setCurrentTab(0) ;// 設定開始索引}}

使用TabHost組件設定Tab切換與intent的結合在開發中較常用到，是app開發架構的基礎
下節預報：Menu菜單

從零開始學android<TabHost標籤組件.二十九.>