实现底部导航栏功能的方法

现在很多Android 应用都采用底部导航栏的功能,这样可以使得用户在使用过程中随意切换不同的页面。 下面结合刚学的Fragment 和RadioButton 来实现一个底部导航栏功能,最终效果如图5-9 至图5-12 所示。

图5-9　首页

图5-11　购物车

图5-10　搜索

图5-12　个人中心

我们在项目开始之前需要做些准备工作,首先将项目所用的8 张图片导入项目中,然后在res 下面新建一个文件夹drawable 用来存放一些自定义资源文件,在src 下面新建com.lemall.fragment 包用来存放所有的Fragment。 准备工作完成后,我们就正式开始底部导航栏功能的实现。

(1)创建资源文件

①创建首页导航栏图片资源table_menu_home.xml,代码如下：

这个资源文件很好理解,当我们单击首页图标后,图标就替换为活动状态的图标(即红色图标)。

②创建搜索导航栏图片资源table_menu_search.xml,代码如下：

③创建购物车导航栏图片资源文件table_menu_cart.xml,代码如下:

④创建个人中心导航栏图片资源文件table_menu_person.xml,代码如下：

⑤创建导航栏背景资源文件table_menu_bg.xml,代码如下：

这里要使用4 个RadioButton,每个RadioButton 的属性几乎是差不多的,因此我们可以把每个RadioButton 相同的属性抽取出来写到styles.xml 文件中。 打开res/values目录下的styles.xml,添加如下代码：

(2)创建Frangment 布局文件

①创建首页布局文件fg_home.xml,代码如下：(www.xing528.com)

该布局文件采用线性布局,在布局文件中添加一个TextView 用来提示当前页面内容。

②创建搜索页布局文件fg_search.xml,代码如下：

③创建购物车页面布局文件fg_cart.xml,代码如下：

④创建个人中心页面布局文件fg_person.xml,代码如下：

(3)创建Fragment

①创建首页碎片类HomeFragment.java,代码如下：

②创建搜索页碎片类SearchFragment.java,代码如下：

③创建购物车页面碎片类CartFragment.java,代码如下：

④创建个人中心页面碎片类PersonFragment.java,代码如下：

(4)打开activity_main.xml 并添加代码

代码如下：

(5)打开MainActivity.java 并添加代码

代码如下：

保存项目,在模拟器中运行就可看到如图5-8 至图5-11 所示的效果了。