利用三方PagerBottomTabStrip完成底部的page滑动效果

github地址：https://github.com/tyzlmjj/PagerBottomTabStrip

for Gradle:

compile ‘me.majiajie:pager-bottom-tab-strip:1.0.0’

布局layout中设置为底部，中间是放fragment的：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ui.NewMainActivity">

    <include
        android:id="@+id/titlebar"
        layout="@layout/main_titlebar" />

    <me.majiajie.pagerbottomtabstrip.PagerBottomTabLayout
        android:id="@+id/boom_layout"
        app:elevation="8dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"/>

    <FrameLayout
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/titlebar"
        android:layout_above="@id/boom_layout" />

</RelativeLayout>

初始化：

    private void initUI() {
        //设置title的text
        title_text.setText(getResources().getString(R.string.yinchuan_app_str));

        //初始化Fragment
        homePageFragment = new HomePageFragment();
        setFragment = new SetFragment();
        mapFragment = new MapFragment();

        //获取管理器
        supportFragmentManager = getSupportFragmentManager();
        //初次登陆，显示首页，隐藏其他
        FragmentTransaction transaction = supportFragmentManager.beginTransaction();
        transaction.add(R.id.main_content, homePageFragment);
        transaction.add(R.id.main_content, setFragment);
        transaction.add(R.id.main_content, mapFragment);
        transaction.hide(setFragment);
        transaction.hide(mapFragment);
        transaction.show(homePageFragment);
        transaction.commit();
    }

所有的控制代码：

    int[] testColors = {0xFF00796B, 0xFF5B4947, 0xFF607D8B, 0xFFF57C00, 0xFFF57C00};
    OnTabItemSelectListener listener = new OnTabItemSelectListener() {
        @Override
        public void onSelected(int index, Object tag) {
            FragmentTransaction transaction = supportFragmentManager.beginTransaction();
            switch (index) {
                case 0:
                    //当选中首页id时，显示frameLayout加载首页fragment
                    transaction.hide(setFragment);
                    transaction.hide(mapFragment);
                    transaction.show(homePageFragment);
                    transaction.commit();
                    break;
                case 1:
                    //当选中轨迹监控id时，显示百度地图的fragment
                    transaction.hide(setFragment);
                    transaction.hide(homePageFragment);
                    transaction.show(mapFragment);
                    transaction.commit();
                    break;
                case 2:
                    //当选中设置id时，显示设置的fragment
                    transaction.show(setFragment);
                    transaction.hide(homePageFragment);
                    transaction.hide(mapFragment);
                    transaction.commit();
                    break;
            }
        }
        @Override
        public void onRepeatClick(int index, Object tag) {
        }
    };

    private void BottomTab() {
        Controller controller;
        PagerBottomTabLayout pagerBottomTabLayout = (PagerBottomTabLayout) findViewById(R.id.boom_layout);

        //用TabItemBuilder构建一个导航按钮
        TabItemBuilder tabItemBuilder = new TabItemBuilder(this).create()
                .setDefaultIcon(R.drawable.homepage_img)
                .setText("首页")
                .setSelectedColor(testColors[0])
                .setTag("A")
                .build();

        //构建导航栏,得到Controller进行后续控制
        controller = pagerBottomTabLayout.builder()
                .addTabItem(tabItemBuilder)
                .addTabItem(R.drawable.setpage_img, "轨迹监控", testColors[1])
                .addTabItem(R.drawable.mappage_img, "设置", testColors[2])
                .setMode(TabLayoutMode.HIDE_TEXT | TabLayoutMode.CHANGE_BACKGROUND_COLOR)
                .build();

        controller.addTabItemClickListener(listener);
    }