TabHost的两种使用方法

• Android 实现tab视图有2种方法，一种就是继承tabactivity，一种是在布局页面中定义<tabhost>标签,

  第一种：使用系统自带写好的TabHost（及继承自TabActivity类）
  

  其具体步骤如下： （1）使用setContentView()方法显示界面。 （2）TabHost对象获得并设置。 （3）创建并设置TabSpec对象。 （4）向TabHost中添加TabSpec完成标签页的使用。
  view source print ?

  01. <?xml version="1.0" encoding="utf-8"?> 

  02. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 

  03. android:layout_width="fill_parent" 

  04. android:layout_height="fill_parent"> 

  05. <LinearLayout android:id="@+id/tab1" 

  06. android:layout_width="fill_parent" android:layout_height="fill_parent" 

  07. androidrientation="vertical"> 

  08. <TextView android:id="@+id/TextView1" 

  09. android:text="This is a tab1" android:layout_width="fill_parent" 

  10. android:layout_height="wrap_content"> 

  11. </TextView> 

  12. </LinearLayout> 

  13. <LinearLayout android:id="@+id/tab2" 

  14. android:layout_width="fill_parent" android:layout_height="fill_parent" 

  15. androidrientation="vertical"> 

  16. <TextView android:id="@+id/TextView2" 

  17. android:text="This is a tab2" android:layout_width="fill_parent" 

  18. android:layout_height="wrap_content"> 

  19. </TextView> 

  20. </LinearLayout> 

  21. <LinearLayout android:id="@+id/tab3" 

  22. android:layout_width="fill_parent" android:layout_height="fill_parent" 

  23. androidrientation="vertical"> 

  24. <TextView android:id="@+id/TextView3" 

  25. android:text="This is a tab3" android:layout_width="fill_parent" 

  26. android:layout_height="wrap_content"> 

  27. </TextView> 

  28. </LinearLayout> 

  29. </FrameLayout>
  view source print ?

  01. import android.app.AlertDialog; 

  02. import android.app.Dialog; 

  03. import android.app.TabActivity; 

  04. import android.content.DialogInterface; 

  05. import android.os.Bundle; 

  06. import android.view.LayoutInflater; 

  07. import android.widget.TabHost; 

  08.  

  09. public class Test_TabWidget extends TabActivity { 

  10. /** Called when the activity is first created. */ 

  11. private TabHost tabHost; 

  12.  

  13. @Override 

  14. public void onCreate(Bundle savedInstanceState) { 

  15. super.onCreate(savedInstanceState); 

  16. // setContentView(R.layout.main); 

  17. tabHost = this.getTabHost(); 

  18. LayoutInflater li = LayoutInflater.from(this); 

  19. li.inflate(R.layout.main, tabHost.getTabContentView(), true); 

  20. tabHost.addTab(tabHost.newTabSpec("Tab_1").setContent(R.id.tab1) 

  21. .setIndicator("TAB1", 

  22. this.getResources().getDrawable(R.drawable.img1))); 

  23. tabHost.addTab(tabHost.newTabSpec("Tab_2").setContent(R.id.tab2) 

  24. .setIndicator("TAB2", 

  25. this.getResources().getDrawable(R.drawable.img2))); 

  26. tabHost.addTab(tabHost.newTabSpec("Tab_3").setContent(R.id.tab3) 

  27. .setIndicator("TAB3", 

  28. this.getResources().getDrawable(R.drawable.img3))); 

  29. tabHost.setCurrentTab(1); 

  30. //      tabHost.setBackgroundColor(Color.GRAY); 

  31. tabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() { 

  32.  

  33. public void onTabChanged(String tabId) { 

  34. Dialog dialog = new AlertDialog.Builder(Test_TabWidget.this) 

  35. .setTitle("提示").setMessage( 

  36. "选中了" + tabId + "选项卡").setIcon(R.drawable.icon).setPositiveButton("确定", new DialogInterface.OnClickListener(){ 

  37.  

  38. public void onClick(DialogInterface dialog, 

  39. int which) { 

  40. // TODO Auto-generated method stub 

  41.  

  42. } 

  43.  

  44. }).create(); 

  45. dialog.show(); 

  46.  

  47. } 

  48.  

  49. }); 

  50. } 

  51. }
  
  第二种：就是定义我们自己的tabHost：不用继承TabActivity。
  
  在自定义TabHost时需要注意，创建TabHost时需要以下3个步骤： （1）在xml资源文件中创建TabHost节点，并将id设置为tabhost。 （2）创建TabWidget子节点，并设置id为tabs。 （3）创建FrameLayout子节点，用于显示内容，其id为tabcontent。 与使用TabActivity相比较不难发现，自定义TabHost时不需要继承TabActivity了，只需要简单继承Activity就可以了，这无疑给我们编程提供了更大的自由发挥的空间。因为我们知道继承虽然会给我们的编程带来很大程度的方便，但也同样带来了很多的条条 框框的限制。 让我们着重来看第二步获得TabHost对象，这里的获得TabHost对象的方法与使用TabActivity时又不一样了，具体方法为： m_TabHost = (TabHost)findViewById(android.R.id.tabhost); 我们发现得到TabHost的方法是最简单、最常见的findViewById()方法！这里的参数就是android.R.id.tabhost，也就是在xml资源文件中我们实现定义的： android:id="@android:id/tabhost" 需要注意的是，在获得了TabHost之后，我们需要调用： TabHost.setup() 调用了该方法之后，TabHost才设置完成可以正常使用。而在使用TabActvity时则不需这一步，因为在getTabHost()方法中已经完成了设置的工作。
  view source print ?

  01. <?xml version="1.0" encoding="utf-8"?>

  02. <TabHost xmlns:android="http://schemas.android.com/apk/res/android" 

  03. android:id="@+id/TabHost01" android:layout_width="fill_parent" 

  04. android:layout_height="fill_parent"> 

  05. <LinearLayout android:layout_width="fill_parent" 

  06. android:orientation="vertical" android:layout_height="fill_parent">   

  07. <FrameLayout android:id="@android:id/tabcontent"                                      //这里的id一定要是"@android:id/tabcontent"

  08. android:layout_width="fill_parent" 

  09. android:layout_height="fill_parent"> 

  10. <LinearLayout android:id="@+id/LinearLayout1" 

  11. android:layout_width="fill_parent" 

  12. android:layout_height="wrap_content"> 

  13. <TextView android:text="one" 

  14. android:id="@+id/TextView01" android:layout_width="wrap_content" 

  15. android:layout_height="wrap_content"> 

  16. </TextView> 

  17. </LinearLayout> 

  18. <LinearLayout android:id="@+id/LinearLayout2" 

  19. android:layout_width="wrap_content" 

  20. android:layout_height="wrap_content"> 

  21. <TextView android:text="two" 

  22. android:id="@+id/TextView02" android:layout_width="fill_parent" 

  23. android:layout_height="wrap_content"> 

  24. </TextView> 

  25. </LinearLayout> 

  26. <LinearLayout android:id="@+id/LinearLayout3" 

  27. android:layout_width="wrap_content" 

  28. android:layout_height="wrap_content"> 

  29. <TextView android:text="three" 

  30. android:id="@+id/TextView03" android:layout_width="fill_parent" 

  31. android:layout_height="wrap_content"> 

  32. </TextView> 

  33. </LinearLayout> 

  34. </FrameLayout> 

  35. <TabWidget android:id="@android:id/tabs"      //注意id表述方式，一定要是"@android:id/tabs"

  36. android:layout_width="fill_parent" 

  37. android:layout_height="wrap_content" />

  38. </LinearLayout> </TabHost>
  
  
  
  view source print ?

  01. import android.app.Activity; 

  02. import android.os.Bundle; 

  03. import android.util.Log; 

  04. import android.view.LayoutInflater; 

  05. import android.widget.TabHost; 

  06.  

  07. public class Test_TabHost extends Activity { 

  08. /** Called when the activity is first created. */ 

  09. private TabHost tabHost; 

  10.  

  11. @Override 

  12. public void onCreate(Bundle savedInstanceState) { 

  13. super.onCreate(savedInstanceState); 

  14. setContentView(R.layout.main); 

  15. try{ 

  16. tabHost = (TabHost) this.findViewById(R.id.TabHost01); 

  17. tabHost.setup(); 

  18.  

  19. tabHost.addTab(tabHost.newTabSpec("tab_1") 

  20. .setContent(R.id.LinearLayout1) 

  21. .setIndicator("TAB1",this.getResources().getDrawable(R.drawable.img1))); 

  22. tabHost.addTab(tabHost.newTabSpec("tab_2") 

  23. .setContent(R.id.LinearLayout2).setIndicator("TAB2", 

  24. this.getResources().getDrawable(R.drawable.img2))); 

  25. tabHost.addTab(tabHost.newTabSpec("tab_3") 

  26. .setContent(R.id.LinearLayout3).setIndicator("TAB3", 

  27. this.getResources().getDrawable(R.drawable.img3))); 

  28. tabHost.setCurrentTab(1); 

  29. }catch(Exception ex){ 

  30. ex.printStackTrace(); 

  31. Log.d("EXCEPTION", ex.getMessage()); 

  32. } 

  33. } 

  34. } 
  
  
  PS
  1、android中的TabActivity是专门用来放置TabHost组件的，但是很遗憾，非常固定，必须放在顶部，对于单手使用手机的人来说，很不方便。所以研究了一下如何将TabBar放置底部，具体思路是在xml布局文件中，将TabWidget放于FrameLayout的下面（两者是垂直线性的关系），并分配各个组件的权重。另外，如果想去掉Tab中那个丑陋的白线，可以通过设置其Padding实现。
  
  2、让自己的类继承TabActivity，然后通过调用getTabHost()方法得到tabhost对象，然后把自己写好的数据展示的布局文件加载到tabhost中，就可以实现了。最后是通过调用addTab（）方法添加标签的相关属性（如：标签名称，标签图片，标签内容布局）。
  而如果通过XML文件配置tabHost则需要注意的是，framelayout,tabwidget标签的id都必须引用系统的id（@android:id/tabcontent,@android:id/tabs），不然会报异常.在程序用使用findViewById()加载tabhost，然后调用tabhost.setup()方法初始化tabhost，后面的步骤则和上面一种一样