仿微信底部导航栏效果，封装成了工具类。

前一段时间写了一个关于微信底部导航栏的简单介绍，因为时间问题没有对代码进行封装，现在我要对项目进行封装，可以通过一个工具类很简单的实现点击底部导航栏实现界面切换，废话不多说了，基本就是这样实现的：

1.首先写总的布局activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
        android:id="@+id/fragment_id"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <View
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:background="#eeeeee" />

    <RadioGroup
        android:layout_alignParentBottom="true"
        android:id="@+id/main_radioGroupId"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        android:orientation="horizontal">

        <RadioButton
            android:checked="true"
            android:id="@+id/one"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:button="@null"
            android:drawableTop="@drawable/selector_college"
            android:gravity="center"
            android:paddingBottom="7dp"
            android:drawablePadding="3dp"
            android:paddingTop="7dp"
            android:text="@string/college"
            android:textColor="@color/color_radiobutton"
            android:textSize="12sp" />

        <RadioButton
            android:drawablePadding="3dp"
            android:id="@+id/two"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:button="@null"
            android:drawableTop="@drawable/selector_learn"
            android:gravity="center"
            android:paddingBottom="7dp"
            android:paddingTop="7dp"
            android:text="@string/learn"
            android:textColor="@color/color_radiobutton"
            android:textSize="12sp" />

        <RadioButton
            android:drawablePadding="3dp"
            android:id="@+id/three"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:button="@null"
            android:drawableTop="@drawable/selector_my"
            android:gravity="center"
            android:paddingBottom="7dp"
            android:paddingTop="7dp"
            android:text="@string/my"
            android:textColor="@color/color_radiobutton"
            android:textSize="12sp" />
    </RadioGroup>
</LinearLayout>

2：底部导航栏的按钮，我这里用的是radiobutton来实现的，通过设置是否选中来修改图片，这里就介绍一个按钮的制作：selector_college.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@mipmap/xueyuan01" android:state_checked="false"></item>
    <item android:drawable="@mipmap/xueyuan01b" android:state_checked="true"></item>
</selector>

文字的选中颜色变化也通过color来实现   首先在res下面创建一个color.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/colorPrimary" android:state_checked="true" />
<!-- not selected -->
<item android:color="@color/colorLine" />
</selector>

下面的重点代码来了，首先介绍一些界面切换的工具类：TabFragmentUtils:这里我用的是几个fragment的显示和隐藏，而不是用replace去替换：

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.view.View;
import android.widget.RadioButton;
import android.widget.RadioGroup;


import java.util.List;

/**
 * Created by lixuce on 2016/5/10 0008.
 * 作用：Fragment的完美切换，不会出现滑动过快而出现闪退现象
 */
public class TabFragmentUtils implements RadioGroup.OnCheckedChangeListener {
    private List<Fragment> fragments;
    private FragmentManager fragmentManager;
    private int container;
    //当前显示的页面
    private int curShowPosition=0;
    private RadioGroup radioGroup;
    public TabFragmentUtils(RadioGroup radioGroup, int container, List<Fragment> fragments, FragmentManager fragmentManager) {
        this.container = container;
        this.fragments = fragments;
        this.radioGroup = radioGroup;
        this.fragmentManager = fragmentManager;
        //设置radiobutton的点事件
        radioGroup.setOnCheckedChangeListener(this);
        //默认选择0 页面
        ((RadioButton) radioGroup.getChildAt(0)).setChecked(true);
    }

    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
        for (int i = 0; i < group.getChildCount(); i++) {
            View view = group.getChildAt(i);
            if(view.getId() == checkedId) {
                //隐藏当前页面
                fragments.get(curShowPosition).onStop();
                //显示点击页面
                if (fragments.get(i).isAdded()) {
                    //点击页面可见
                    fragments.get(i).onStart();
                } else {
                    fragmentManager.beginTransaction().add(container, fragments.get(i)).commit();
                }
                //真正的显示fragment
                showFragment(i);
            }
        }
    }
    //显示页面
    private void showFragment(int index) {
        for (int i = 0; i < fragments.size(); i++) {
            FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
            if(i == index)
            {//就是要显示的页面
                fragmentTransaction.show(fragments.get(i));
            }
            else
            {
                fragmentTransaction.hide(fragments.get(i));
            }
            fragmentTransaction.commit();
        }
        //当前显示的页面为 index
        curShowPosition = index;
    }
}

这面是这个工具类的使用方法 ，很简单就可以实现：里面有两个小技巧

public class MainActivity extends BaseActivity {


    RadioGroup mainRadioGroupId;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mainRadioGroupId = (RadioGroup) findViewById(R.id.main_radioGroupId);
        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
        NewsFragment guideFragment = NewsFragment.newInstance();
        fragmentTransaction.add(R.id.fragment_id, guideFragment);
        fragmentTransaction.commit();
        List<Fragment> fragments = new ArrayList<>();
        fragments.add(guideFragment);
        fragments.add(GuideFragment.newInstance(1));
        fragments.add(MineFragment.newInstance());
        new TabFragmentUtils(mainRadioGroupId, R.id.fragment_id, fragments, getSupportFragmentManager());
    }

    @Override
    protected void onSaveInstanceState(Bundle outState) {
        //小技巧 重写这个方法  然后不重写父类的方法，可以避免程序闪退之后，几个fragment，会重叠！
        //super.onSaveInstanceState(outState);

    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        //小技巧   就是在首页按返回键的时候，应用不会退出，微信，QQ，支付宝，一类的都是这样做的，有点小流氓！
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            Intent intent = new Intent(Intent.ACTION_MAIN);
            intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
            intent.addCategory(Intent.CATEGORY_HOME);
            startActivity(intent);
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }

}

这样是不是很简单就可以实现了，我前一段时间写的那个只是简单的介绍，现在封装成工具类的，可以减少很多代码，而且很简单实现，稍后我会写出Demo上传资源，欢迎大家进行下载。

Demo下载地址： 仿微信底部导航栏