android中Fragment+RadioButton实现底部导航栏

概述在App中经常看到这样的tab底部导航栏那么这种效果是如何实现，实现的方式有很多种，最常见的就是使用Fragment+RadioButton去实现。下面我们来写一个例子

在App中经常看到这样的tab底部导航栏

那么这种效果是如何实现，实现的方式有很多种，最常见的就是使用Fragment+Radiobutton去实现。下面我们来写一个例子
首先我们先在activity_mian.xml定义布局，整个布局的外面是线性布局，上面是帧布局切换不同的Fragment，底下是RadioGroup嵌套的是Radiobutton。代码如下所示：

<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"  androID:background="#ffffff"  androID:orIEntation="vertical">  <FrameLayout    androID:ID="@+ID/frameLayout"    androID:layout_wIDth="match_parent"    androID:layout_height="0dp"    androID:layout_weight="1" />  <RadioGroup    androID:ID="@+ID/rg_main"    androID:layout_wIDth="match_parent"    androID:layout_height="wrap_content"    androID:layout_alignParentBottom="true"    androID:background="@drawable/home_bottom_parent_bg"    androID:orIEntation="horizontal">    <Radiobutton      androID:ID="@+ID/rb_home"            androID:drawabletop="@drawable/home_button_selector"      androID:text="首页" />    <Radiobutton      androID:ID="@+ID/rb_type"            androID:drawabletop="@drawable/type_button_selector"      androID:text="分类" />    <Radiobutton      androID:ID="@+ID/rb_community"            androID:drawabletop="@drawable/community_button_selector"      androID:paddingtop="10dp"      androID:text="发现" />    <Radiobutton      androID:ID="@+ID/rb_cart"            androID:drawabletop="@drawable/cart_button_selector"      androID:text="购物车" />    <Radiobutton      androID:ID="@+ID/rb_user"            androID:drawabletop="@drawable/user_button_selector"      androID:text="个人中心" />  </RadioGroup></linearLayout>

注意：上面还有样式和drawable，下面我们一个一个的来完善。

首先来看样式，打开【res】―【values】―【styles】，代码如下所示：

 <style name="MainbuttonStyle">    <!-- Customize your theme here. -->    <item name="androID:layout_wIDth">0dp</item>    <item name="androID:layout_height">wrap_content</item>    <item name="androID:layout_weight">1</item>    <item name="androID:button">@null</item>    <!--  <item name="androID:drawablepadding">3dp</item>-->    <item name="androID:textcolor">@drawable/bottom_button_text_selector</item>    <item name="androID:textSize">10sp</item>    <item name="androID:gravity">center</item>  </style>

里面还有一个<item name="androID:textcolor">@drawable/bottom_button_text_selector</item>，这个是设置图片和文字的颜色，在drawable的目录下建bottom_button_text_selector，代码如下所示：

<?xml version="1.0" enCoding="utf-8"?><selector xmlns:androID="http://schemas.androID.com/apk/res/androID">  <item androID:color="#535353" androID:state_checked="false"></item>  <item androID:color="#ff4040" androID:state_checked="true"></item></selector>

接着我们继续来完善drawable，有【首页】【分类】【发现】【购物车】【个人中心】，写法都是一样的，这里用【首页】来做例子，在drawable目录下建home_button_selector，代码如下所示：

<?xml version="1.0" enCoding="utf-8"?><selector xmlns:androID="http://schemas.androID.com/apk/res/androID">  <item androID:drawable="@drawable/main_home" androID:state_checked="false"></item>  <item androID:drawable="@drawable/main_home_press" androID:state_checked="true"></item></selector>

接下来看MainActivity中的代码，代码如下：

package com.nyl.shopPingmall.app.activity;import androID.os.Bundle;import androID.support.v4.app.Fragment;import androID.support.v4.app.FragmentActivity;import androID.support.v4.app.FragmentTransaction;import androID.Widget.FrameLayout;import androID.Widget.RadioGroup;import com.nyl.shopPingmall.R;import com.nyl.shopPingmall.base.BaseFragment;import com.nyl.shopPingmall.community.fragment.CommunityFragment;import com.nyl.shopPingmall.home.fragment.HomeFragment;import com.nyl.shopPingmall.shopPingcart.fragment.ShopPingCartFragment;import com.nyl.shopPingmall.type.fragment.TypeCartFragment;import com.nyl.shopPingmall.user.fragment.UserCartFragment;import java.util.ArrayList;import butterknife.Bind;import butterknife.ButterKnife;public class MainActivity extends FragmentActivity{  @Bind(R.ID.frameLayout)  FrameLayout frameLayout;  @Bind(R.ID.rg_main)  RadioGroup rgMain;  //装fragment的实例集合  private ArrayList<BaseFragment> fragments;  private int position = 0;  //缓存Fragment或上次显示的Fragment  private Fragment tempFragment;  @OverrIDe  protected voID onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    setContentVIEw(R.layout.activity_main);    //ButterKnife和当前Activity绑定    ButterKnife.bind(this);    //初始化Fragment    initFragment();    //设置RadioGroup的监听    initListener();  }  private voID initListener() {    rgMain.check(R.ID.rb_home);    rgMain.setonCheckedchangelistener(new RadioGroup.OnCheckedchangelistener() {      @OverrIDe      public voID onCheckedChanged(RadioGroup radioGroup,int i) {        switch (i){          case R.ID.rb_home: //首页            position = 0;            break;          case R.ID.rb_type: //分类            position = 1;            break;          case R.ID.rb_community: //发现            position = 2;            break;          case R.ID.rb_cart: //购物车            position = 3;            break;          case R.ID.rb_user: //个人中心            position = 4;            break;          default:            position = 0;            break;        }        //根据位置得到相应的Fragment        BaseFragment baseFragment = getFragment(position);        /**         * 第一个参数: 上次显示的Fragment         * 第二个参数: 当前正要显示的Fragment         */        switchFragment(tempFragment,baseFragment);      }    });  }  /**   * 添加的时候按照顺序   */  private voID initFragment(){    fragments = new ArrayList<>();    fragments.add(new HomeFragment());    fragments.add(new TypeCartFragment());    fragments.add(new CommunityFragment());    fragments.add(new ShopPingCartFragment());    fragments.add(new UserCartFragment());  }  /**   * 根据位置得到对应的 Fragment   * @param position   * @return   */  private BaseFragment getFragment(int position){    if(fragments != null && fragments.size()>0){      BaseFragment baseFragment = fragments.get(position);      return baseFragment;    }    return null;  }  /**   * 切换Fragment   * @param fragment   * @param nextFragment   */  private voID switchFragment(Fragment fragment,BaseFragment nextFragment){    if (tempFragment != nextFragment){      tempFragment = nextFragment;      if (nextFragment != null){        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();        //判断nextFragment是否添加成功        if (!nextFragment.isAdded()){          //隐藏当前的Fragment          if (fragment != null){            transaction.hIDe(fragment);          }          //添加Fragment          transaction.add(R.ID.frameLayout,nextFragment).commit();        }else {          //隐藏当前Fragment          if (fragment != null){            transaction.hIDe(fragment);          }          transaction.show(nextFragment).commit();        }      }    }  }}

首先使用ButterKnife初始化布局控件，然后在onCreate方法中初始化Fragment和绑定RadioGroup的选中改变事件，为了方便初始化Fragment，写了一个initFragment方法，在方法内部创建HomeFragment,TypeCartFragment,CommunityFragment,ShopPingCartFragment,UserCartFragment四个Fragment实例，然后使用一个fragments集合存储这四个实例。接下来写一个switchFragment方法，用于切换显示指定的Fragmetn，当RadioGroup的选中改变时，首先根据选中的位置获取到对应的Fragment，然后将获取到的Fragment传入到switchFragment方法中进行显示。由于每次RadioGroup的选中改变获取到的Fragment都不一样，从而可以实现根据选中的RadioGroup展示不同的Fragment效果，也就是常见的Tab切换效果。

Activity中用到的HomeFragment,UserCartFragment这四个Fragment的代码比较简单，以HomeFragment为例，代码如下：

package com.nyl.shopPingmall.home.fragment;import androID.util.Log;import androID.vIEw.Gravity;import androID.vIEw.VIEw;import androID.Widget.TextVIEw;import com.nyl.shopPingmall.base.BaseFragment;/** * 首页Fragment */public class HomeFragment extends BaseFragment {  private final static String TAG = HomeFragment.class.getSimplename();  private TextVIEw textVIEw;  @OverrIDe  public VIEw initVIEw() {    textVIEw = new TextVIEw(mContext);    textVIEw.setGravity(Gravity.CENTER);    textVIEw.setTextSize(25);    Log.e(TAG,"主页面的Fragment的UI被初始化了");    return textVIEw;  }  @OverrIDe  public voID initData() {    super.initData();    textVIEw.setText("首页");    Log.e(TAG,"主页面的Fragment的数据被初始化了");  }}

HomeFragment继承自BaseFragment，然后重写父类的initVIEw方法和initData方法，BaseFragment的代码如下：

package com.nyl.shopPingmall.base;import androID.content.Context;import androID.os.Bundle;import androID.support.annotation.Nullable;import androID.support.v4.app.Fragment;import androID.vIEw.LayoutInflater;import androID.vIEw.VIEw;import androID.vIEw.VIEwGroup;/** * 基类Fragment * 首页：HomeFragment * 分类：TypeFragment * 发现：CommunityFragment * 购物车：ShopPingCartFragment * 用户中心：UserFragment * 等等都要继承该类 */public abstract class BaseFragment extends Fragment{  protected Context mContext;  /**   * 当该类被系统创建的时候回调   * @param savedInstanceState   */  @OverrIDe  public voID onCreate(@Nullable Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    mContext = getActivity();  }  @Nullable  @OverrIDe  public VIEw onCreateVIEw(LayoutInflater inflater,@Nullable VIEwGroup container,@Nullable Bundle savedInstanceState) {    return initVIEw();  }  //抽象类，由孩子实现，实现不同的效果  public abstract VIEw initVIEw();  @OverrIDe  public voID onActivityCreated(@Nullable Bundle savedInstanceState) {    super.onActivityCreated(savedInstanceState);    initData();  }  /**   * 当子类需要联网请求数据的时候，可以重写该方法，该方法中联网请求   */  public voID initData() {  }}

其余几个Fragment的代码也类似，这里就不再细说了，使用Fragment+Radiobutton实现底部导航栏的思路和代码实现就是这样的。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的android中Fragment+RadioButton实现底部导航栏全部内容，希望文章能够帮你解决android中Fragment+RadioButton实现底部导航栏所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。