控件TabHost的功能和web技术中的“选项卡”控件显示的效果一样。都是用最小的空间显示更多的数据。下面直接通过例子看Tabhost的用法。

示例1：通过继承TabActivity实现

布局文件：

<!-- 布局必须为FrameLayout -->
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"  ><!-- 定义一个LinearLayout,用于显示第个Tab页的内容，每个LinearLayout代表一页的内容 --><LinearLayoutandroid:id="@+id/tab1"android:orientation="vertical"android:layout_width="match_parent"android:layout_height="match_parent"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="第一页"/>    </LinearLayout><!-- 定义第二个个LinearLayout,用于显示第个Tab页的内容 --> <LinearLayoutandroid:id="@+id/tab2"android:orientation="vertical"android:layout_width="match_parent"android:layout_height="match_parent"> <TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="第二页"/>    </LinearLayout>
</FrameLayout>

MainActivity.java内容：

public class MainActivity extends TabActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//获取TabHost的引用TabHost tabHost = getTabHost();//获取视图，并LayoutInflater.from(this).inflate(R.layout.activity_main,tabHost.getTabContentView(), true);//添加Tab也的内容。tabHost.addTab(tabHost.newTabSpec("tab1")//设置Tab页的标示.setIndicator("导航一",//设置标题getResources().getDrawable(R.drawable.ic_launcher))//设置标题图片，也可以不写.setContent(R.id.tab1));//设置Tab内容tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("导航二",getResources().getDrawable(R.drawable.ic_launcher)).setContent(R.id.tab2));}
}

运行结果如图：

示例2：

MainActivity.java:

public class MainActivity extends TabActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//获取TabHost的引用TabHost tabHost = getTabHost();//为Tab添加内容tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("导航一",getResources().getDrawable(R.drawable.ic_launcher)).setContent(new Intent(this, Act2.class)));//与示例1不同。这里直接添加Intent的引用tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("导航二",getResources().getDrawable(R.drawable.ic_launcher)).setContent(new Intent(this, Act3.class)));}
}

注：这个方法要另建两个Activity及相应的xml文件。每一个Activity既为每个Tab页的内容。在此代码就不在给出。运行结果和示例1完全相同。

示例3：自定义TabHost

main.xml:

<!-- 直接引用系统提供的Tabhost组件即可 -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"xmlns:android1="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent" ><TabHostandroid1:id="@+id/tabhost"android1:layout_width="match_parent"android1:layout_height="match_parent"android1:layout_alignParentLeft="true"android1:layout_alignParentTop="true" ><LinearLayoutandroid1:layout_width="match_parent"android1:layout_height="match_parent"android1:orientation="vertical" ><TabWidgetandroid1:id="@android:id/tabs"android1:layout_width="match_parent"android1:layout_height="80dp" ></TabWidget><FrameLayoutandroid1:id="@android:id/tabcontent"android1:layout_width="match_parent"android1:layout_height="match_parent" ><LinearLayoutandroid1:id="@+id/tab1"android1:layout_width="match_parent"android1:layout_height="match_parent"android1:orientation="vertical" ><TextViewandroid1:layout_width="wrap_content"android1:layout_height="wrap_content"android1:text="第一页" />                  </LinearLayout><LinearLayoutandroid1:id="@+id/tab2"android1:orientation="vertical"android1:layout_width="match_parent"android1:layout_height="match_parent" ><TextViewandroid1:layout_width="wrap_content"android1:layout_height="wrap_content"android1:text="第二页" /></LinearLayout><LinearLayoutandroid1:id="@+id/tab3"android1:orientation="vertical"android1:layout_width="match_parent"android1:layout_height="match_parent" ><TextViewandroid1:layout_width="wrap_content"android1:layout_height="wrap_content"android1:text="第三页" /></LinearLayout></FrameLayout></LinearLayout></TabHost>
</RelativeLayout>

另外还要定义一个cell.xml:

<?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" ><ImageViewandroid:id="@+id/p_w_picpathView1"android:layout_width="wrap_content"android:layout_height="wrap_content"/><TextViewandroid:id="@+id/textView1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="TextView" />
</LinearLayout>

接下来是MainActivity：

public class MainActivity extends Activity {private TabWidget tabWidget;private TabHost tabHost;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);//获取Tabhost控件tabHost=(TabHost)findViewById(R.id.tabhost);//初始化tabHost.setup();//tabWidget=tabHost.getTabWidget();//创建tab页内容TabSpec spec1=tabHost.newTabSpec("tab1");//通过自定义的函数创建标题。spec1.setIndicator(CreatTabView(tabHost,"导航1",R.drawable.ic_launcher));spec1.setContent(R.id.tab1);tabHost.addTab(spec1);TabSpec spec2=tabHost.newTabSpec("tab2");spec2.setIndicator(CreatTabView(tabHost,"导航2",R.drawable.ic_launcher));spec2.setContent(R.id.tab2);tabHost.addTab(spec2);TabSpec spec3=tabHost.newTabSpec("tab3");spec3.setIndicator(CreatTabView(tabHost,"导航3",R.drawable.ic_launcher));spec3.setContent(R.id.tab3);tabHost.addTab(spec3);/*showSpec();tabHost.setOnTabChangedListener(new OnTabChangeListener() {@Overridepublic void onTabChanged(String tabId) {showSpec();}          });     */     }/*public void showSpec() {for (int i = 0; i < tabWidget.getChildCount(); i++) {// 获得当前的视图对象View v = tabWidget.getChildAt(i);// 判断当前点击的视图对象是否与得到的视图对象相同if (tabHost.getCurrentTab() == i) {v.setBackgroundResource(R.drawable.ic_blue);} else {v.setBackgroundResource(R.drawable.ic_green);}}}*//*** 自定义tab显示样式（图片加文字）*/public View CreatTabView(TabHost tabHost,String tabtitle,int tabID){//获取视图的引用View tabview=LayoutInflater.from(this).inflate(R.layout.cell, null);//设置组件内容TextView tv=(TextView)tabview.findViewById(R.id.textView1);tv.setText(tabtitle);ImageView iv=(ImageView)tabview.findViewById(R.id.p_w_picpathView1);iv.setBackgroundResource(tabID);//返回一个视图       return tabview;}
}

运行结果如下图所示，点击效果不明显。明显不是我所需要的结果。将注释部分放开后，显示效果如右图，这时需要我们添加点击效果。