自从Android3.0引入Fargment之后,在Activity中使用底部导航进行Fragment的切换已经越来越普遍,或者可以说已经成为了移动应用的标配,而本篇文章我总结了项目中常用的几种实现导航的方式,分别是RadioGroup、Tablayout、RadioGroup+反射和FragmentTabHost四种实现方式,包含底部和顶部的双导航界面的实现,实现的结果类似下图所示:
Github下载地址:https://github.com/huohaoliz/BottomNavigation
一、使用RadioGroup+Fragment实现底部导航,使用TabLayout+Fragment实现顶部导航
1,RadioGroup+Fragment的形式是之前开发中比较受欢迎,使用比较多的一种实现形式,所以把它排到第一位。好了不扯了,直接代码走起:
首先,在radiogroup.xml中的布局文件是:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.linktestproject.RadioGroupActivity">
<FrameLayout
android:id="@+id/fl_radio_show"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
></FrameLayout>
<RadioGroup
android:id="@+id/rg_radio_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_gravity="bottom">
<RadioButton
android:id="@+id/rb_radio_homepage"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:drawableTop="@drawable/homepage"
android:text="@string/homepage"
android:button="@null"
android:drawablePadding="5dp"
android:textColor="@drawable/radio_button_selector"
/>
<RadioButton
android:id="@+id/rb_radio_subscription"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:drawableTop="@drawable/subscription"
android:text="@string/subscription"
android:button="@null"
android:drawablePadding="5dp"
android:textColor="@drawable/radio_button_selector"
/>
<RadioButton
android:id="@+id/rb_radio_find"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:drawableTop="@drawable/find"
android:text="@string/find"
android:button="@null"
android:drawablePadding="5dp"
android:textColor="@drawable/radio_button_selector"
/>
<RadioButton
android:id="@+id/rb_radio_mine"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:drawableTop="@drawable/mine"
android:text="@string/mine"
android:button="@null"
android:drawablePadding="5dp"
android:textColor="@drawable/radio_button_selector"
/>
</RadioGroup>
</LinearLayout>
我们需要对每个RadioButton的图片资源做一个选择器,在drawable文件夹下添加四个选择器,内容是(这是首页的图片选择器,其他与此类似就不贴代码了):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@mipmap/tab4_down"></item>
<item android:state_checked="false" android:drawable="@mipmap/tab4"></item>
</selector>
之后我们还要对选中的RadioButton添加字体颜色的选择器:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="@color/textChecked"></item>
<item android:state_checked="false" android:color="@color/textUnChecked"></item>
</selector>