1. 案例1---TabProject
（1）首先是main.xml文件：
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:orientation="vertical" 4 android:layout_width="fill_parent" 5 android:layout_height="fill_parent" 6 android:background="@drawable/bg2" 7 > 8 <Button 9 android:layout_width="fill_parent" 10 android:layout_height="wrap_content" 11 android:text="This is Tab1" 12 android:id="@+id/btn" 13 /> 14 <EditText 15 android:layout_width="fill_parent" 16 android:layout_height="wrap_content" 17 android:text="This is Tab2" 18 android:id="@+id/et" 19 /> 20 <LinearLayout 21 android:orientation="vertical" 22 android:layout_width="fill_parent" 23 android:layout_height="fill_parent" 24 android:id="@+id/mylayout" 25 android:background="@drawable/bg" // 覆盖了前面的@drawable/bg2 26 > 27 <Button 28 android:layout_width="fill_parent" 29 android:layout_height="wrap_content" 30 android:text="This is Tab3" 31 /> 32 <EditText 33 android:layout_width="fill_parent" 34 android:layout_height="wrap_content" 35 android:text="This is Tab3" 36 /> 37 </LinearLayout> 38 </LinearLayout>
（2）然后是MainActivity.java文件：
1 package com.tab; 2 3 import android.app.TabActivity; 4 import android.os.Bundle; 5 import android.view.LayoutInflater; 6 import android.widget.TabHost; 7 import android.widget.Toast; 8 import android.widget.TabHost.OnTabChangeListener; 9 import android.widget.TabHost.TabSpec; 10 11 public class MainActivity extends TabActivity implements OnTabChangeListener { 12 private TabSpec ts1, ts2, ts3;//声明3个分页 13 private TabHost tableHost;//分页菜单(tab的容器) 14 @Override 15 public void onCreate(Bundle savedInstanceState) { 16 super.onCreate(savedInstanceState); 17 tableHost = this.getTabHost();//实例(分页)菜单,getTabHost()這是TabActivity方法，获取TabHost实例 18 19 //利用LayoutInflater将布局与分页菜单一起显示 20 //from是LayoutInflater的静态方法,LayoutInflater.from(this),this表示当前MainActivity 21 //在当前context下获取LayoutInflater的实例，从而可以调用inflate方法 22 //inflate(参数1,参数2):参数1表示需要加载的布局文件id，参数2表示附加在resource资源文件的根控件 23 LayoutInflater.from(this).inflate(R.layout.main, tableHost.getTabContentView()); 24 //分别给ts1,ts2,ts3分页进行设置，绑定资源 25 ts1 = tableHost.newTabSpec("tabOne");//实例化一个分页,这里"tabOne"这个标签ID绑定分页1，实现下面的接口实现操作 26 ts1.setIndicator("Tab1")//设置此分页显示的标题,字母会大写显示 27 .setContent(R.id.btn);//设置此分页的资源id 28 29 ts2 = tableHost.newTabSpec("tabTwo"); 30 //设置此分页显示的标题和图标 31 ts2.setIndicator("Tab2", getResources().getDrawable(R.drawable.icon)) 32 .setContent(R.id.et); 33 34 ts3 = tableHost.newTabSpec("tabThree"); 35 ts3.setIndicator("Tab3") 36 .setContent(R.id.mylayout);//设置此分页的布局id 37 38 tableHost.addTab(ts1);//菜单中添加ts1分页 39 tableHost.addTab(ts2);//菜单中添加ts2分页 40 tableHost.addTab(ts3);//菜单中添加ts3分页 41 42 43 tableHost.setOnTabChangedListener(this); 44 } 45 @Override 46 public void onTabChanged(String tabId) { 47 if (tabId.equals("tabOne")) {//ts1 = tableHost.newTabSpec("tabOne"); 48 Toast.makeText(this, "分页1", Toast.LENGTH_LONG).show(); 49 } 50 if (tabId.equals("tabTwo")) { 51 Toast.makeText(this, "分页2", Toast.LENGTH_LONG).show(); 52 } 53 if (tabId.equals("tabThree")) { 54 Toast.makeText(this, "分页3", Toast.LENGTH_LONG).show(); 55 } 56 } 57 }
总结：
(1)这里把main.xml作为一个整体资源进行分配给不同标签分页，位置分别在自己分页置顶
(2)使用OnTabChangeListener接口，重写OnTabChanged(String tabId)函数
(3)判断OnTabChanged(String tabId)中的tabId参数进行处理事件；这里的tabId对应的是实例中每个分页传入的分页ID，例如ts1的ID为：
tableHost.newTabSpec("tabOne")，而不是TabSpec.setIndicatior()设置的标题。
2. 案例2---TabTest
（1）首先是activity_main.xml文件：
1 <?xml version="1.0" encoding="utf-8"?> 2 <TabHost xmlns:android="http://schemas.android.com/apk/res/android" 3 android:id="@android:id/tabhost" 4 android:layout_width="fill_parent" 5 android:layout_height="fill_parent" > 6 7 <RelativeLayout 8 android:layout_width="fill_parent" 9 android:layout_height="fill_parent" 10 android:orientation="vertical" > 11 12 <TabWidget 13 android:id="@android:id/tabs" 14 android:layout_width="fill_parent" 15 android:layout_height="wrap_content" 16 android:layout_alignParentBottom="true" > 17 </TabWidget> 18 19 <FrameLayout 20 android:id="@android:id/tabcontent" 21 android:layout_width="fill_parent" 22 android:layout_height="wrap_content" > 23 24 <TextView 25 android:id="@+id/textview1" 26 android:layout_width="fill_parent" 27 android:layout_height="fill_parent" 28 android:text="this is a tab" /> 29 30 <TextView 31 android:id="@+id/textview2" 32 android:layout_width="fill_parent" 33 android:layout_height="fill_parent" 34 android:text="this is another tab" /> 35 36 <TextView 37 android:id="@+id/textview3" 38 android:layout_width="fill_parent" 39 android:layout_height="fill_parent" 40 android:text="this is a third tab" /> 41 </FrameLayout> 42 43 44 45 </RelativeLayout> 46 47 </TabHost>
（2）其次是MainAcitivity.java文件：
1 package com.dream.tabtest; 2 import java.util.ArrayList; 3 import java.util.List; 4 5 import android.app.TabActivity; 6 import android.graphics.Color; 7 import android.os.Bundle; 8 import android.view.Gravity; 9 import android.view.View; 10 import android.widget.ImageView; 11 import android.widget.LinearLayout; 12 import android.widget.TabHost; 13 import android.widget.TabHost.OnTabChangeListener; 14 import android.widget.TextView; 15 16 @SuppressWarnings("deprecation") //deprecation:过期的,@SuppressWarnings("deprecation")：表示不检测过期的方法 17 public class MainActivity extends TabActivity { 18 19 //声明TabHost对象 20 TabHost mTabHost; 21 public List<ImageView> imageList = new ArrayList<ImageView>(); 22 /** Called when the activity is first created. */ 23 @Override 24 public void onCreate(Bundle savedInstanceState) 25 { 26 super.onCreate(savedInstanceState); 27 setContentView(R.layout.activity_main); 28 29 //取得TabHost对象 30 mTabHost = getTabHost(); 31 32 /* 为TabHost添加标签 */ 33 //新建一个newTabSpec(newTabSpec) 34 //设置其标签和图标(setIndicator) 35 //设置内容(setContent) 36 mTabHost.addTab(mTabHost.newTabSpec("tab_test1") 37 .setIndicator(composeLayout("TAB_1", R.drawable.img1))//给tab1一个标签 指示 38 .setContent(R.id.textview1)); 39 mTabHost.addTab(mTabHost.newTabSpec("tab_test2") 40 .setIndicator(composeLayout("TAB_2", R.drawable.img2))//给tab2一个标签 指示 41 .setContent(R.id.textview2)); 42 mTabHost.addTab(mTabHost.newTabSpec("tab_test3") 43 .setIndicator(composeLayout("TAB_3", R.drawable.img3))//给tab3一个标签 指示 44 .setContent(R.id.textview3)); 45 46 //设置TabHost的背景颜色 47 //mTabHost.setBackgroundColor(Color.argb(150, 22, 70, 150)); 48 //设置TabHost的背景图片资源 49 //mTabHost.setBackgroundResource(R.drawable.image1); 50 51 //设置当前显示哪一个标签 52 mTabHost.setCurrentTab(0); 53 imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img01)); 54 55 //标签切换事件处理，setOnTabChangedListener 56 //onTabChanged(String str)的监听,该监听是只有当你切换tab时才会发生动作事件 57 mTabHost.setOnTabChangedListener(new OnTabChangeListener() 58 { 59 // TODO Auto-generated method stub 60 public void onTabChanged(String tabId) 61 { 62 // 设置所有选项卡的图片为未选中图片 63 imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img1)); 64 imageList.get(1).setImageDrawable(getResources().getDrawable(R.drawable.img2)); 65 imageList.get(2).setImageDrawable(getResources().getDrawable(R.drawable.img3)); 66 67 if (tabId.equalsIgnoreCase("tab_test1")) { 68 imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img01)); 69 // 移动底部背景图片 70 //moveTopSelect(0); 71 } else if (tabId.equalsIgnoreCase("tab_test2")) { 72 imageList.get(1).setImageDrawable(getResources().getDrawable(R.drawable.img02)); 73 // 移动底部背景图片 74 //moveTopSelect(1); 75 } else if (tabId.equalsIgnoreCase("tab_test3")) { 76 imageList.get(2).setImageDrawable(getResources().getDrawable(R.drawable.img03)); 77 // 移动底部背景图片 78 //moveTopSelect(2); 79 } 80 81 } 82 }); 83 } 84 /** 85 * 这个设置Tab标签本身的布局，需要TextView和ImageView不能重合 s:是文本显示的内容 i:是ImageView的图片位置 86 */ 87 public View composeLayout(String s, int i) { 88 // 定义一个LinearLayout布局 89 LinearLayout layout = new LinearLayout(this); 90 // 设置布局垂直显示 91 layout.setOrientation(LinearLayout.VERTICAL); 92 ImageView iv = new ImageView(this); 93 imageList.add(iv); 94 iv.setImageResource(i); 95 //设置图片布局 96 LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, 50); 97 lp.setMargins(0, 0, 0, 0); 98 layout.addView(iv, lp); 99 // 定义TextView 100 TextView tv = new TextView(this); 101 tv.setGravity(Gravity.CENTER); 102 tv.setSingleLine(true); 103 tv.setText(s); 104 tv.setTextColor(Color.BLACK); 105 tv.setTextSize(10); 106 //设置Text布局 107 layout.addView(tv, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT)); 108 return layout; 109 } 110 }
3. 总结:
所谓的TabHost是提供选项卡（Tab页）的窗口视图容器.
此对象包含两个子对象：一个是使用户可以选择指定标签页的标签的集合TabWidge；TabWidget类似于Android 中查看电话薄的界面，通过多个标签切换显示不同内容。另一个是用于显示标签页内容的 FrameLayout. 选项卡中的个别元素一般通过其容器对象来控制，而不是直接设置子元素本身的值。