Use of Android TabWidget/TabHost

2010-06-07Android TabWidget/TabHost usage

Article category: Java programmingAndroid TabWidget/TabHost can be used in either of the following ways:

First, use the built-in TabHost (and inherit from the TabActivity class) Code as follows:

Java code

Bytes

1. <? Xml version = "1.0" encoding = "UTF-8"?>
2. <FrameLayout xmlns: android = "http://schemas.android.com/apk/res/android"
3. Android: layout_width = "fill_parent"
4. Android: layout_height = "fill_parent">
5. <LinearLayout android: id = "@ + id/tab1"
6. Android: layout_width = "fill_parent" android: layout_height = "fill_parent"
7. Androidrientation = "vertical">
8. <TextView android: id = "@ + id/TextView1"
9. 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>

Java code

Bytes

1. Package com. Aina. Android;
3. Import android. app. AlertDialog;
4. Import android. app. Dialog;
5. Import android. app. TabActivity;
6. Import android. content. DialogInterface;
7. Import android. OS. Bundle;
8. Import android. view. LayoutInflater;
9. Import android. widget. TabHost;
11. Public class Test_TabWidget extends TabActivity {
12. /** Called when the activity is first created .*/
13. Private TabHost tabHost;
15. @ Override
16. Public void onCreate (Bundle savedInstanceState ){
17. Super. onCreate (savedInstanceState );
18. // SetContentView (R. layout. main );
19. TabHost = this. getTabHost ();
20. LayoutInflater li = LayoutInflater. from (this );
21. Li. inflate (R. layout. main, tabHost. getTabContentView (), true );
22. TabHost. addTab (tabHost. newTabSpec ("Tab_1"). setContent (R. id. tab1)
23. . SetIndicator ("TAB1 ",
24. This. getResources (). getDrawable (R. drawable. img1 )));
25. TabHost. addTab (tabHost. newTabSpec ("Tab_2"). setContent (R. id. tab2)
26. . SetIndicator ("TAB2 ",
27. This. getResources (). getDrawable (R. drawable. img2 )));
28. TabHost. addTab (tabHost. newTabSpec ("Tab_3"). setContent (R. id. tab3)
29. . SetIndicator ("TAB3 ",
30. This. getResources (). getDrawable (R. drawable. img3 )));
31. TabHost. setCurrentTab (1 );
32. // TabHost. setBackgroundColor (Color. GRAY );
33. TabHost. setOnTabChangedListener (new TabHost. OnTabChangeListener (){
35. Public void onTabChanged (String tabId ){
36. Dialog dialog = new AlertDialog. Builder (Test_TabWidget.this)
37. . SetTitle ("prompt"). setMessage (
38. "+ TabId +" tab "selected). setIcon (R. drawable. icon). setPositiveButton (" OK ", new DialogInterface. OnClickListener (){
40. Public void onClick (DialogInterface dialog,
41. Int which ){
42. // TODO Auto-generated method stub
44. }
46. }). Create ();
47. Dialog. show ();
49. }
51. });
52. }
53. }

Second, we define our own tabHost: we do not need to inherit TabActivity. The specific code is as follows:

Java code

Bytes

1. <? Xml version = "1.0" encoding = "UTF-8"?>
2. <TabHost xmlns: android = "http://schemas.android.com/apk/res/android"
3. Android: id = "@ + id/TabHost01" android: layout_width = "fill_parent"
4. Android: layout_height = "fill_parent">
5. <LinearLayout android: layout_width = "fill_parent"
6. Android: orientation = "vertical" android: layout_height = "fill_parent">
7. <TabWidget android: id = "@ android: id/tabs"
8. Android: layout_width = "fill_parent"
9. Android: layout_height = "wrap_content"/>
10. <FrameLayout android: id = "@ android: id/tabcontent"
11. Android: layout_width = "fill_parent"
12. Android: layout_height = "fill_parent">
13. <LinearLayout android: id = "@ + id/LinearLayout1"
14. Android: layout_width = "fill_parent"
15. Android: layout_height = "wrap_content">
16. <TextView android: text = "one"
17. Android: id = "@ + id/TextView01" android: layout_width = "wrap_content"
18. Android: layout_height = "wrap_content">
19. </TextView>
20. </LinearLayout>
21. <LinearLayout android: id = "@ + id/LinearLayout2"
22. Android: layout_width = "wrap_content"
23. Android: layout_height = "wrap_content">
24. <TextView android: text = "two"
25. Android: id = "@ + id/TextView02" android: layout_width = "fill_parent"
26. Android: layout_height = "wrap_content">
27. </TextView>
28. </LinearLayout>
29. <LinearLayout android: id = "@ + id/LinearLayout3"
30. Android: layout_width = "wrap_content"
31. Android: layout_height = "wrap_content">
32. <TextView android: text = "three"
33. Android: id = "@ + id/TextView03" android: layout_width = "fill_parent"
34. Android: layout_height = "wrap_content">
35. </TextView>
36. </LinearLayout>
37. </FrameLayout>
38. </LinearLayout>
39. </TabHost>

Java code

Bytes

1. Package com. Aina. Android;
3. Import android. app. Activity;
4. Import android. OS. Bundle;
5. Import android. util. Log;
6. Import android. view. LayoutInflater;
7. Import android. widget. TabHost;
9. Public class Test_TabHost extends Activity {
10. /** Called when the activity is first created .*/
11. Private TabHost tabHost;
13. @ Override
14. Public void onCreate (Bundle savedInstanceState ){
15. Super. onCreate (savedInstanceState );
16. SetContentView (R. layout. main );
17. Try {
18. TabHost = (TabHost) this. findViewById (R. id. TabHost01 );
19. TabHost. setup ();
21. TabHost. addTab (tabHost. newTabSpec ("tab_1 ")
22. . SetContent (R. id. LinearLayout1)
23. . SetIndicator ("TAB1", this. getResources (). getDrawable (R. drawable. img1 )));
24. TabHost. addTab (tabHost. newTabSpec ("tab_2 ")
25. . SetContent (R. id. LinearLayout2). setIndicator ("TAB2 ",
26. This. getResources (). getDrawable (R. drawable. img2 )));
27. TabHost. addTab (tabHost. newTabSpec ("tab_3 ")
28. . SetContent (R. id. LinearLayout3). setIndicator ("TAB3 ",
29. This. getResources (). getDrawable (R. drawable. img3 )));
30. TabHost. setCurrentTab (1 );
31. } Catch (Exception ex ){
32. Ex. printStackTrace ();
33. Log. d ("EXCEPTION", ex. getMessage ());
34. }
36. }
37. }

Note: the id of the TabWidget in the layout file must be defined in the second method.
Android: id = "@ android: id/tabs". The id of FrameLayout must be defined.
Android: id = "@ android: id/tabcontent" is not restricted. Otherwise, an error is returned.