TabHost与RadioGroup兑现底部菜单

TabHost与RadioGroup实现底部菜单

转自：http://www.iteye.com/topic/1116261

?

?

在android中实现菜单功能有多种方法。

Options Menu：用户按下menu Button时显示的菜单。

Context Menu：用户长时间按下屏幕，所显示出来的菜单也称为上下文菜单。

Submenu：子菜单。

但是有时候这些内置的菜单并不能满足我们功能，这就需要自己自定义一种菜单。接下来我说的这种就是通过TabHost与RadioGroup结合完成的菜单。这也是很常用的一种底部菜单做法。先上图：

?

?

首先看布局文件：

?

?

?

?

?

1. <?xml?version="1.0"?encoding="UTF-8"?>??
2. <TabHost?android:id="@android:id/tabhost"?android:layout_width="fill_parent"?android:layout_height="fill_parent"??
3. ??xmlns:android="http://schemas.android.com/apk/res/android">??
4. ????<LinearLayout???
5. ????????android:orientation="vertical"???
6. ????????android:layout_width="fill_parent"???
7. ????????android:layout_height="fill_parent">??
8. ????????<FrameLayout???
9. ????????????android:id="@android:id/tabcontent"???
10. ????????????android:layout_width="fill_parent"???
11. ????????????android:layout_height="0.0dip"???
12. ????????????android:layout_weight="1.0"?/>??
13. ????????<TabWidget???
14. ????????????android:id="@android:id/tabs"???
15. ????????????android:visibility="gone"???
16. ????????????android:layout_width="fill_parent"???
17. ????????????android:layout_height="wrap_content"???
18. ????????????android:layout_weight="0.0"?/>??
19. ????????<RadioGroup???
20. ????????????android:gravity="center_vertical"???
21. ????????????android:layout_gravity="bottom"???
22. ????????????android:orientation="horizontal"???
23. ????????????android:id="@+id/main_radio"???
24. ????????????android:background="@drawable/maintab_toolbar_bg"???
25. ????????????android:layout_width="fill_parent"???
26. ????????????android:layout_height="wrap_content">??
27. ????????????<RadioButton???
28. ????????????????android:id="@+id/radio_button0"???
29. ????????????????android:tag="radio_button0"???
30. ????????????????android:layout_marginTop="2.0dip"???
31. ????????????????android:text="@string/alarm"???
32. ????????????????android:drawableTop="@drawable/icon_1"???
33. ????????????????style="@style/main_tab_bottom"?/>??
34. ????????????<RadioButton???
35. ????????????????android:id="@+id/radio_button1"???
36. ????????????????android:tag="radio_button1"???
37. ????????????????android:layout_marginTop="2.0dip"???
38. ????????????????android:text="@string/message"???
39. ????????????????android:drawableTop="@drawable/icon_2"???
40. ????????????????style="@style/main_tab_bottom"?/>??
41. ????????????<RadioButton???
42. ????????????????android:id="@+id/radio_button2"???
43. ????????????????android:tag="radio_button2"???
44. ????????????????android:layout_marginTop="2.0dip"???
45. ????????????????android:text="@string/photo"???
46. ????????????????android:drawableTop="@drawable/icon_3"???
47. ????????????????style="@style/main_tab_bottom"?/>??
48. ????????????<RadioButton???
49. ????????????????android:id="@+id/radio_button3"???
50. ????????????????android:tag="radio_button3"???
51. ????????????????android:layout_marginTop="2.0dip"???
52. ????????????????android:text="@string/music"???
53. ????????????????android:drawableTop="@drawable/icon_4"???
54. ????????????????style="@style/main_tab_bottom"?/>??
55. ????????????<RadioButton???
56. ????????????????android:id="@+id/radio_button4"???
57. ????????????????android:tag="radio_button4"???
58. ????????????????android:layout_marginTop="2.0dip"???
59. ????????????????android:text="@string/setting"???
60. ????????????????android:drawableTop="@drawable/icon_5"???
61. ????????????????style="@style/main_tab_bottom"?/>??
62. ????????</RadioGroup>??
63. ????</LinearLayout>??
64. </TabHost>??

?

需要注意的是，如果用TabHost这个控件，其中有几个ID是必须这么写的，android:id="@android:id/tabhost?? ；android:id="@android:id/tabcontent" ；android:id="@android:id/tabs" ；之所以要这么写是因为在TabHost这个类中。需要实例化上述这个ID的控件。看源码：

?

在TabActivity中有么个方法：

1. @Override??
2. ???public?void?onContentChanged()?{??
3. ???????super.onContentChanged();??
4. ???????mTabHost?=?(TabHost)?findViewById(com.android.internal.R.id.tabhost);??
5. ??
6. ???????if?(mTabHost?==?null)?{??
7. ???????????throw?new?RuntimeException(??
8. ???????????????????"Your?content?must?have?a?TabHost?whose?id?attribute?is?"?+??
9. ???????????????????"'android.R.id.tabhost'");??
10. ???????}??
11. ???????mTabHost.setup(getLocalActivityManager());??
12. ???}??
13. ??
14. ???private?void?ensureTabHost()?{??
15. ???????if?(mTabHost?==?null)?{??
16. ???????????this.setContentView(com.android.internal.R.layout.tab_content);??
17. ???????}??
18. ???}??

?当内容发生改变时它会调用这个方法，来更新列表或者其他视图，而这个方法中需要实例化TabHost，所以必须通过ID为tabhost实例化。

?

再看看TabHost这个类中，

?

1. public?void?setup()?{??
2. ??????mTabWidget?=?(TabWidget)?findViewById(com.android.internal.R.id.tabs);??
3. ??????if?(mTabWidget?==?null)?{??
4. ??????????throw?new?RuntimeException(??
5. ??????????????????"Your?TabHost?must?have?a?TabWidget?whose?id?attribute?is?'android.R.id.tabs'");??
6. ??????}??
7. ??
8. ??????//?KeyListener?to?attach?to?all?tabs.?Detects?non-navigation?keys??
9. ??????//?and?relays?them?to?the?tab?content.??
10. ??????mTabKeyListener?=?new?OnKeyListener()?{??
11. ??????????public?boolean?onKey(View?v,?int?keyCode,?KeyEvent?event)?{??
12. ??????????????switch?(keyCode)?{??
13. ??????????????????case?KeyEvent.KEYCODE_DPAD_CENTER:??
14. ??????????????????case?KeyEvent.KEYCODE_DPAD_LEFT:??
15. ??????????????????case?KeyEvent.KEYCODE_DPAD_RIGHT:??
16. ??????????????????case?KeyEvent.KEYCODE_DPAD_UP:??
17. ??????????????????case?KeyEvent.KEYCODE_DPAD_DOWN:??
18. ??????????????????case?KeyEvent.KEYCODE_ENTER:??
19. ??????????????????????return?false;??
20. ??
21. ??????????????}??
22. ??????????????mTabContent.requestFocus(View.FOCUS_FORWARD);??
23. ??????????????return?mTabContent.dispatchKeyEvent(event);??
24. ??????????}??
25. ??
26. ??????};??
27. ??
28. ??????mTabWidget.setTabSelectionListener(new?TabWidget.OnTabSelectionChanged()?{??
29. ??????????public?void?onTabSelectionChanged(int?tabIndex,?boolean?clicked)?{??
30. ??????????????setCurrentTab(tabIndex);??
31. ??????????????if?(clicked)?{??
32. ??????????????????mTabContent.requestFocus(View.FOCUS_FORWARD);??
33. ??????????????}??
34. ??????????}??
35. ??????});??
36. ??
37. ??????mTabContent?=?(FrameLayout)?findViewById(com.android.internal.R.id.tabcontent);??
38. ??????if?(mTabContent?==?null)?{??
39. ??????????throw?new?RuntimeException(??
40. ??????????????????"Your?TabHost?must?have?a?FrameLayout?whose?id?attribute?is?"??
41. ??????????????????????????+?"'android.R.id.tabcontent'");??
42. ??????}??
43. ??}??

?这个方法，是在增加选项卡之前由系统调用。在这个方法中需要通过tabs 这个ID实例化一个TabWidget，通过tabcontent这个ID实例化一个FrameLayout，用来放置选项卡内容。所以这两个ID也是固定的。

?

在上述布局文件中隐藏了系统默认的Widget，取而代之的是带有图片的Button。

?

看一下主要代码：

1. package?com.iteye.androidtoast;??
2. ??
3. import?android.app.TabActivity;??
4. import?android.content.Intent;??
5. import?android.os.Bundle;??
6. import?android.widget.RadioGroup;??
7. import?android.widget.RadioGroup.OnCheckedChangeListener;??
8. import?android.widget.TabHost;??
9. ??
10. public?class?MainActivity?extends?TabActivity?implements?OnCheckedChangeListener{??
11. ????/**?Called?when?the?activity?is?first?created.?*/??
12. ????private?TabHost?mHost;??
13. ????private?RadioGroup?radioderGroup;??
14. ????@Override??
15. ????public?void?onCreate(Bundle?savedInstanceState)?{??
16. ????????super.onCreate(savedInstanceState);??
17. ????????setContentView(R.layout.maintabs);??
18. ????????//实例化TabHost??
19. ????????mHost=this.getTabHost();??
20. ??????????
21. ????????//添加选项卡??
22. ????????mHost.addTab(mHost.newTabSpec("ONE").setIndicator("ONE")??
23. ????????????????????.setContent(new?Intent(this,OneActivity.class)));??
24. ????????mHost.addTab(mHost.newTabSpec("TWO").setIndicator("TWO")??
25. ????????????????.setContent(new?Intent(this,TwoActivity.class)));??
26. ????????mHost.addTab(mHost.newTabSpec("THREE").setIndicator("THREE")??
27. ????????????????.setContent(new?Intent(this,ThreeActivity.class)));??
28. ????????mHost.addTab(mHost.newTabSpec("FOUR").setIndicator("FOUR")??
29. ????????????????.setContent(new?Intent(this,FourActivity.class)));??
30. ????????mHost.addTab(mHost.newTabSpec("FIVE").setIndicator("FIVE")??
31. ????????????????.setContent(new?Intent(this,FiveActivity.class)));??
32. ??????????
33. ????????radioderGroup?=?(RadioGroup)?findViewById(R.id.main_radio);??
34. ????????radioderGroup.setOnCheckedChangeListener(this);??
35. ????}??
36. ????@Override??
37. ????public?void?onCheckedChanged(RadioGroup?group,?int?checkedId)?{??
38. ????????switch(checkedId){??
39. ????????case?R.id.radio_button0:??
40. ????????????mHost.setCurrentTabByTag("ONE");??
41. ????????????break;??
42. ????????case?R.id.radio_button1:??
43. ????????????mHost.setCurrentTabByTag("TWO");??
44. ????????????break;??
45. ????????case?R.id.radio_button2:??
46. ????????????mHost.setCurrentTabByTag("THREE");??
47. ????????????break;??
48. ????????case?R.id.radio_button3:??
49. ????????????mHost.setCurrentTabByTag("FOUR");??
50. ????????????break;??
51. ????????case?R.id.radio_button4:??
52. ????????????mHost.setCurrentTabByTag("FIVE");??
53. ????????????break;??
54. ????????}?????????
55. ????}??
56. } ?