Android入门第十一篇之TabHost,TabWidget .

这回要介绍的是Android的Tab控件，Tab控件可以达到分页的效果，让一个屏幕的内容尽量丰富，当然也会增加开发的复杂程度，在有必要的时候再使用。Android的Tab控件使用起来有点奇怪，必须包含和按照以下的顺序：

TabHost控件->TabWidget(必须命名为tabs)->FrameLayout(必须命名为tabcontent)。

接下来贴出本例运行的截图：

main.xml的源码：

[xhtml] view plain copy print ?

1. <?xmlversion="1.0"encoding="utf-8"?>
2. <TabHostandroid:layout_width="fill_parent"
3. android:layout_height="fill_parent"xmlns:android="http://schemas.android.com/apk/res/android"android:id="@android:id/TabHost1">
4. <TabWidgetandroid:id="@android:id/tabs"
5. android:layout_height="wrap_content"android:layout_width="fill_parent">
6. </TabWidget>
7. <FrameLayoutandroid:id="@android:id/tabcontent"
8. android:paddingTop="65px"android:layout_width="fill_parent"android:layout_height="fill_parent">
9. <LinearLayoutandroid:layout_height="wrap_content"android:id="@+id/Tab1"android:orientation="vertical"android:layout_width="fill_parent">
10. <EditTextandroid:layout_height="wrap_content"android:id="@+id/edtTab1"android:layout_width="fill_parent"></EditText>
11. <Buttonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:id="@+id/btnTab1"android:text="Tab1"></Button>
12. </LinearLayout>
13. <LinearLayoutandroid:layout_height="wrap_content"android:id="@+id/Tab2"android:layout_width="fill_parent"android:orientation="horizontal">
14. <EditTextandroid:layout_height="wrap_content"android:id="@+id/edtTab2"android:layout_width="wrap_content"android:layout_weight="300"></EditText>
15. <Buttonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:id="@+id/btnTab2"android:text="Tab2"></Button></LinearLayout>
16. </FrameLayout>
17. </TabHost>

<?xml version="1.0" encoding="utf-8"?> <TabHost android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/TabHost1"> <TabWidget android:id="@android:id/tabs" android:layout_height="wrap_content" android:layout_width="fill_parent"> </TabWidget> <FrameLayout android:id="@android:id/tabcontent" android:paddingTop="65px" android:layout_width="fill_parent" android:layout_height="fill_parent"> <LinearLayout android:layout_height="wrap_content" android:id="@+id/Tab1" android:orientation="vertical" android:layout_width="fill_parent"> <EditText android:layout_height="wrap_content" android:id="@+id/edtTab1" android:layout_width="fill_parent"></EditText> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/btnTab1" android:text="Tab1"></Button> </LinearLayout> <LinearLayout android:layout_height="wrap_content" android:id="@+id/Tab2" android:layout_width="fill_parent" android:orientation="horizontal"> <EditText android:layout_height="wrap_content" android:id="@+id/edtTab2" android:layout_width="wrap_content" android:layout_weight="300"></EditText> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/btnTab2" android:text="Tab2"></Button></LinearLayout> </FrameLayout> </TabHost>

程序源码:

[java] view plain copy print ?

1. packagecom.testTab;
2. importandroid.app.TabActivity;
3. importandroid.os.Bundle;
4. importandroid.view.View;
5. importandroid.widget.Button;
6. importandroid.widget.EditText;
7. importandroid.widget.TabHost;
8. importandroid.widget.TabHost.TabSpec;
9. publicclasstestTabextendsTabActivity{//基于TabActivity构建
11. ButtonbtnTab1,btnTab2;
12. EditTextedtTab1,edtTab2;
13. /**Calledwhentheactivityisfirstcreated.*/
14. @Override
15. publicvoidonCreate(BundlesavedInstanceState){
16. super.onCreate(savedInstanceState);
17. setContentView(R.layout.main);
19. TabHosttabs=getTabHost();
20. //设置Tab1
21. TabSpectab1=tabs.newTabSpec("tab1");
22. tab1.setIndicator("tab1");//设置tab1的名称
23. tab1.setContent(R.id.Tab1);//关联控件
24. tabs.addTab(tab1);//添加tab1
26. btnTab1=(Button)this.findViewById(R.id.btnTab1);
27. edtTab1=(EditText)this.findViewById(R.id.edtTab1);
28. btnTab1.setOnClickListener(newClickEvent());
30. //设置Tab2
31. TabSpectab2=tabs.newTabSpec("tab2");
32. tab2.setIndicator("tab2");
33. tab2.setContent(R.id.Tab2);
34. tabs.addTab(tab2);
36. btnTab2=(Button)this.findViewById(R.id.btnTab2);
37. edtTab2=(EditText)this.findViewById(R.id.edtTab2);
38. btnTab2.setOnClickListener(newClickEvent());
40. tabs.setCurrentTab(0);
41. }
43. classClickEventimplementsView.OnClickListener{
44. @Override
45. publicvoidonClick(Viewv){
46. if(v==btnTab1)
47. {
48. edtTab1.setText("tab1");
49. }
50. elseif(v==btnTab2)
51. {
52. edtTab2.setText("tab2");
53. }
54. }
56. }
57. }