利用TabWidget实现底部菜单

TabWidget类似于通话记录的界面，通过切换多个标签从而显示出多个不同内容，能够展示内容丰富的页面信息，而且彼此之间不会干扰，有利于展示。下面，通过一个例子来学习用法

首先用一个类来继承TabActivity

在开发之前，我们要首先了解，TabHost是整个Tab的容器，包括两部分，TabWidget和FrameLayout。TabWidget就是每个tab的标签，FrameLayout则是tab内容。接着我们开始初始化main.xml。
首先声明TabHost，包含TabWidget，FrameLayout元素。

    <TabHost android:id="@android:id/tabhost"  //声明控件IDandroid:layout_width="fill_parent"    //控件宽度与父控件一致android:layout_height="fill_parent">  //控件高度与父控件一致
声明TabWidget，tab标签页<TabWidget android:layout_width="fill_parent"      //控件宽度与父控件一致android:layout_height="wrap_content"   //控件高度与自身适应android:id="@android:id/tabs">    //声明控件ID
声明FrameLayout，tab页里的内容信息<FrameLayout android:layout_width="fill_parent"   //控件宽度与父控件一致android:layout_height="wrap_content"  //控件高度与自身适应android:id="@android:id/tabcontent">   //声明控件ID

注意下：
如果我们使用extends TabAcitivty，如同ListActivity，TabHost必须设置为@android:id/tabhost
TabWidget必须设置android:id为@android:id/tabs
FrameLayout需要设置android:id为@android:id/tabcontent

布局文件

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:id="@android:id/tabhost" ><LinearLayout
        android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical" ><FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent"android:layout_height="0.0dip"android:layout_weight="1.0"/><TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent"android:layout_height="wrap_content"android:visibility="gone"/><RadioGroup
             android:id="@+id/tab_items"android:gravity="center_vertical"android:layout_width="fill_parent"android:layout_height="wrap_content"android:orientation="horizontal"android:layout_gravity="bottom"android:background="@drawable/tab_bg"><RadioButton
                   android:id="@+id/tab_item_home"android:checked="true"                     style="@style/main_tab_bottom"android:background="@drawable/item_home_bg" /><RadioButton
                   android:id="@+id/tab_item_nearby"  style="@style/main_tab_bottom"android:background="@drawable/item_near_bg"/><RadioButton
                   android:id="@+id/tab_item_sort"   style="@style/main_tab_bottom"android:background="@drawable/item_sort_bg" /><RadioButton
                   android:id="@+id/tab_item_mine"  style="@style/main_tab_bottom"android:background="@drawable/item_mine_bg"/>                <RadioButton
                   android:id="@+id/tab_item_more"  style="@style/main_tab_bottom" android:background="@drawable/item_more_bg" /></RadioGroup></LinearLayout></TabHost>

其中有些控件的图片点击与正常情况下是不同的,如item_home_bg.xml文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" ><item android:state_checked="true" android:drawable="@drawable/but_index_r_v2" /><item android:drawable="@drawable/but_index_v2"/>
</selector>

style文件在values文件夹下的styles.xml文件中定义

<?xml version="1.0" encoding="utf-8"?>
<resources><style name="main_tab_bottom"><item name="android:gravity">center_horizontal</item><item name="android:layout_width">fill_parent</item><item name="android:layout_height">wrap_content</item><item name="android:button">@null</item><item name="android:layout_weight">1.0</item></style></resources>

函数实现

public class MyTab extends TabActivity{private final static String TAG = "TabShow";private TabHost mHost;private RadioGroup tabItems;private RadioButton mineBut;@Overrideprotected void onCreate(Bundle savedInstanceState) {// TODO Auto-generated method stubsuper.onCreate(savedInstanceState);setContentView(R.layout.tablay);initResourceRefs();initSettings();}private void initSettings() {// TODO Auto-generated method stubtabItems.setOnCheckedChangeListener(new OnCheckedChangeListener() {@Overridepublic void onCheckedChanged(RadioGroup group, int checkedId) {// TODO Auto-generated method stubswitch(checkedId){case R.id.tab_item_home :mHost.setCurrentTabByTag("HOME");break;case R.id.tab_item_nearby :mHost.setCurrentTabByTag("NEAR");break;case R.id.tab_item_sort :mHost.setCurrentTabByTag("SORT");break;         case R.id.tab_item_more :mHost.setCurrentTabByTag("MORE");break;}}});}private void initResourceRefs() {// TODO Auto-generated method stubmHost = getTabHost();mHost.addTab(mHost.newTabSpec("HOME").setIndicator("HOME").setContent(new Intent(this , HomeActivity.class)));mHost.addTab(mHost.newTabSpec("NEAR").setIndicator("NEAR").setContent(new Intent(this , NearByActivity.class)));mHost.addTab(mHost.newTabSpec("SORT").setIndicator("SORT").setContent(new Intent(this , SortActivity.class)));mHost.addTab(mHost.newTabSpec("My").setIndicator("My").setContent(new Intent(this , MyActivity.class)));mHost.addTab(mHost.newTabSpec("MORE").setIndicator("MORE").setContent(new Intent(this , MoreActivity.class)));tabItems = (RadioGroup)findViewById(R.id.tab_items);mineBut = (RadioButton)findViewById(R.id.tab_item_mine);}}

效果如下

利用TabWidget实现底部菜单相关推荐

转-TabHost组件(二)（实现底部菜单导航）
http://www.cnblogs.com/lichenwei/p/3975095.html 上面文章<安卓开发复习笔记--TabHost组件(一)(实现底部菜单导航)>中提到了利用自定 ...
小巫新闻客户端底部菜单切换实现
Android-小巫新闻客户端底部菜单切换实现 2012年12月7日星期五真快啊,12月了,到了一年的最后一个月,意味着学期也快要结束了.小巫还在认真得学习着Android,尽管学习得不怎么样,但 ...
【微信小程序】之如何创建底部菜单？tabBar、mp-tabbar
方法一:通过app.json配置底部菜单(常用) 小程序根目录下的 app.json 文件用来对微信小程序进行全局配置.文件内容为一个 JSON 对象全局配置 | 微信开放文档微信开发者平台文档htt ...
替代TabActivity，底部菜单主框架搭建
看到还有些人在使用TabActvity,这个已经被Google废弃了的类,为了大家方便,写了一个能代替TabActivity的东西.说白了也就是对viewpager跟底部菜单进行了一个封装,标准的底部 ...
底部居中_中文编程：安卓的底部菜单设计
原创所有,侵权必究! 完成中文编程的安卓开发环境.电脑版的手机模拟器安装.设置. 我们开始中文安卓的开发吧,本文先尝试实现"底部菜单.上部内容"的界面设计. 新建项目打开&quo ...
[Android] 底部菜单布局+PopupWindows实现弹出菜单功能(初级篇)
这篇文章主要是自己研究如何对底部菜单进行布局,并简单的实现点击不同"按钮"实现图片切换和背景切换的功能,最后通过PopupWindows实现弹出菜单,点击不同按钮能实现不同 ...
android 底部菜单
2019独角兽企业重金招聘Python工程师标准>>> 新浪微薄上的一个底部菜单的实现,有兴趣的可以看一下转载:http://www.adobex.com/android/sou ...
解决input获取焦点时底部菜单被顶上来问题
当input获取焦点时底部菜单被顶上来问题解决方案: 1.如果是短页面,比如登录页,上部的登录表单div与底部的菜单div不会重合(两个div是同级的),可以通过设置登录表单div的z-index比底 ...
微信小程序怎么添加底部菜单按钮
继续微信小程序方面的教程,今天讲怎么在空白的小程序页面添加几个类似菜单的按钮,实现点击某个按钮跳转到对应界面,而不是单单局限于一个页面. 需要什么: 微信小程序账户电脑一台电脑安装微信开发者工具软 ...