Android UI控制項系列：TabWidget（切換卡）

Tab選項卡類似與電話本的介面，通過多個標籤切換不同的內容，要實現這個效果，首先要知道TabHost，它是一個用來存放多個Tab標籤的容器，每一個Tab都可以對應自己的布局，比如，電話本中的Tab布局就是一個線性布局

要使用TabHost，首先要通過getTabHost方法擷取TabHost的對象，然後通過addTab方法來向TabHost中添加Tab，當然每個Tab在切換時都會產生一個事件，要捕捉這個事件，需要設定TabActivity的事件監聽setOnTabChangedListener

下面是個小例子：

TabTest.java

package org.hualang.tab;import android.app.Activity;import android.app.TabActivity;import android.graphics.Color;import android.os.Bundle;import android.widget.TabHost;import android.widget.Toast;import android.widget.TabHost.OnTabChangeListener;public class TabTest extends TabActivity {    /** Called when the activity is first created. */        TabHost tabhost;    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);        //取得TabHost對象        tabhost = getTabHost();        //為TabHost添加標籤        //建立一個newTabSpec(newTabSpec)        //設定其標籤和表徵圖（setIndicator）        //設定內容（setContent）        tabhost.addTab(tabhost.newTabSpec("tab1")                        .setIndicator("TAB 1",getResources().getDrawable(R.drawable.img1))                        .setContent(R.id.text1));        tabhost.addTab(tabhost.newTabSpec("tab2")                .setIndicator("TAB 2",getResources().getDrawable(R.drawable.img2))                .setContent(R.id.text2));        tabhost.addTab(tabhost.newTabSpec("tab3")                .setIndicator("TAB 3",getResources().getDrawable(R.drawable.img3))                .setContent(R.id.text3));        //設定TabHost的背景顏色        //tabhost.setBackgroundColor(Color.argb(150,22,70,150));        //設定TabHost的背景圖片資源        tabhost.setBackgroundResource(R.drawable.bg0);        //設定當前顯示哪個標籤        tabhost.setCurrentTab(0);        //標籤切換事件處理，setOnTabChangedListener        tabhost.setOnTabChangedListener(new OnTabChangeListener()        {                public void onTabChanged(String tabId)                {                        Toast toast=Toast.makeText(getApplicationContext(), "現在是"+tabId+"標籤", Toast.LENGTH_SHORT);                        toast.show();                }        });    }}

main.xml

<?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">            <TextView                android:id="@+id/text1"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:text="選項卡1" />            <TextView                android:id="@+id/text2"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:text="選項卡2" />            <TextView                android:id="@+id/text3"                android:layout_width="fill_parent"                android:layout_height="fill_parent"                android:text="選項卡3" />            </FrameLayout>    </LinearLayout></TabHost>

運行效果如下：

以上就是Android UI控制項系列：TabWidget（切換卡）的內容，更多相關內容請關注topic.alibabacloud.com（www.php.cn）！

