The most comprehensive Android tab and tabhost in history

From http://www.eoeandroid.com/thread-1035-1-1.html

 

Tab and tabhost

This is the tab, and the container that holds the tab is the tabhost.
How to implement it ??
Each tab also corresponds to a layout, which is a bit fun. An activity corresponds to Multiple Functional la S.
① Create a tab project. do not generate the main activity.

Do not select
② Create a class mytab in the package and inherit from tabactivity.
In fact, tabactivity is a subclass of activity.

1. Package ZYF. Tab. test;
3. Import Android. App. tabactivity;
5. Public class mytab extends tabactivity {
7. }

Copy code

③ Inherit the oncreate () entry method from the parent class

1. Package ZYF. Tab. test;
2. Import Android. App. tabactivity;
3. Import Android. OS. Bundle;
4. Public class mytab extends tabactivity {
5. @ Override
6. Protected void oncreate (bundle savedinstancestate ){
7. // Todo auto-generated method stub
8. Super. oncreate (savedinstancestate );
9. }
10. }

Copy code

④ Register the mytab class (activity) in the manifest. xml file)

1. <Activity Android: Name = ". mytab">
2. <Intent-filter>
3. <Action Android: Name = "android. Intent. Action. Main"> </Action>
4. <Category Android: Name = "android. Intent. Category. launcher"> </Category>
5. </Intent-filter>
6. </Activity>

Copy code

⑤ At this time, you need to design the layout corresponding to the tab. Generally, framelayout is used as the root layout. Each tab page corresponds to the layout of a subnode.

1. <? XML version = "1.0" encoding = "UTF-8"?>
2. <! -- Root node layout -->
3. <Framelayout xmlns: Android = "http://schemas.android.com/apk/res/android"
4. Android: layout_width = "fill_parent" Android: layout_height = "fill_parent">
6. <! -- Layout of the first tab -->
7. <Linearlayout Android: Id = "@ + ID/widget_layout_blue"
8. Android: layout_width = "fill_parent" Android: layout_height = "fill_parent"
9. Androidrientation = "vertical">
10. <Edittext Android: Id = "@ + ID/widget34" Android: layout_width = "fill_parent"
11. Android: layout_height = "wrap_content" Android: text = "edittext"
12. Android: textsize = "18sp">
13. </Edittext>
14. <Button Android: Id = "@ + ID/widget30" Android: layout_width = "wrap_content"
15. Android: layout_height = "wrap_content" Android: text = "button">
16. </Button>
17. </Linearlayout>
18. <! -- Layout of the second tab -->
19. <Linearlayout Android: Id = "@ + ID/widget_layout_red"
20. Android: layout_width = "fill_parent" Android: layout_height = "fill_parent"
21. Androidrientation = "vertical">
22. <Analogclock Android: Id = "@ + ID/widget36"
23. Android: layout_width = "wrap_content" Android: layout_height = "wrap_content">
24. </Analogclock>
25. </Linearlayout>
26. <! -- Layout of the third tab -->
27. <Linearlayout Android: Id = "@ + ID/widget_layout_green"
28. Android: layout_width = "fill_parent" Android: layout_height = "fill_parent"
29. Androidrientation = "vertical">
30. <Radiogroup Android: Id = "@ + ID/widget43"
31. Android: layout_width = "166px" Android: layout_height = "98px"
32. Androidrientation = "vertical">
33. <Radiobutton Android: Id = "@ + ID/widget44"
34. Android: layout_width = "wrap_content" Android: layout_height = "wrap_content"
35. Android: text = "radiobutton">
36. </Radiobutton>
37. <Radiobutton Android: Id = "@ + ID/widget45"
38. Android: layout_width = "wrap_content" Android: layout_height = "wrap_content"
39. Android: text = "radiobutton">
40. </Radiobutton>
41. </Radiogroup>
42. </Linearlayout>
43. </Framelayout>

Copy code

⑥ First, we should declare the tabhost, and then use layoutinflater to filter out the layout and add the framelayout containing the tab page to the tabhost.

1. Private tabhost mytabhost;
2. Mytabhost = This. gettabhost (); // obtain the tabhost on the tabactivity
3. Layoutinflater. From (this). Inflate (R. layout. Main, mytabhost. gettabcontentview (), true );
4. // From (this) Get layoutinflater from this tabactivity
5. // R. layout. Main stores the tab Layout
6. // Use tabhost to obtain the framelayout that stores the tab content.
7. // Whether to tie inflate to the root layout element
8. Mytabhost. setbackgroundcolor (color. argb (150, 22, 70,150 ));
9. // Set the color of tabhost.

Copy code

7. Create a label in tabhost and set the title/icon/TAB layout.

1. Mytabhost
2. . Addtab (mytabhost. newtabspec ("TT") // create a new tag TT
3. . Setindicator ("KK ",
4. Getresources (). getdrawable (R. drawable. ajjc ))
5. // Set the title to KK and the label icon to ajjc.
6. . Setcontent (R. Id. widget_layout_red ));
7. // Set the layout of this tab to R. Id. widget_layout_red. This is a sub-layout in framelayout.

Copy code

Handler tag switching event processing, setontabchangedlistener

1. Mytabhost. setontabchangedlistener (New ontabchangelistener (){
2. @ Override
3. Public void ontabchanged (string Tabid ){
4. // Todo auto-generated method stub
5. }
6. });

Copy code

Dynamic menu of each tab
Put the menu designed in XML into an int array.

1. Private Static final int mymenuresources [] = {R. Menu. phonebook_menu,
2. R. Menu. addphone_menu, R. Menu. chatting_menu, R. Menu. userapp_menu };

Copy code

In the setontabchangedlistener () method, set the mymenusettingtag Based on the tag switch.

1. @ Override
2. Public void ontabchanged (string tagstring ){
3. // Todo auto-generated method stub
4. If (tagstring. Equals ("one ")){
5. Mymenusettingtag = 1;
6. }
7. If (tagstring. Equals ("two ")){
8. Mymenusettingtag = 2;
9. }
10. If (tagstring. Equals ("three ")){
11. Mymenusettingtag = 3;
12. }
13. If (tagstring. Equals ("four ")){
14. Mymenusettingtag = 4;
15. }
16. If (mymenu! = NULL ){
17. Oncreateoptionsmenu (mymenu );
18. }
19. }

Copy code

Then, the oncreateoptionsmenu (menu) method dynamically adds the menu through the menuinflater Filter

1. @ Override
2. Public Boolean oncreateoptionsmenu (menu ){
3. // Todo auto-generated method stub
4. // Hold on to this
5. Mymenu = menu;
6. Mymenu. Clear (); // clear the menu
7. // Inflate the currently selected menu XML resource.
8. Menuinflater Inflater = getmenuinflater ();
9. // Obtain a menu filter from tabactivity
10. Switch (mymenusettingtag ){
11. Case 1:
12. Inflater. Inflate (mymenuresources [0], menu );
13. // Dynamically Add the corresponding XML menu in the array
14. Break;
15. Case 2:
16. Inflater. Inflate (mymenuresources [1], menu );
17. Break;
18. Case 3:
19. Inflater. Inflate (mymenuresources [2], menu );
20. Break;
21. Case 4:
22. Inflater. Inflate (mymenuresources [3], menu );
23. Break;
24. Default:
25. Break;
26. }
27. Return super. oncreateoptionsmenu (menu );
28. }

Copy code

Worker Running Effect