TabLayout+View Pager+Fragment 实现页面左右滑动切换

一、先上图看看效果

二、添加依赖

//因为TabLayout是Android Design Support Library 中的控件，所以需要在build.gradle添加依赖
compile 'com.android.support:design:25.2.0'

三、界面布局代码

注意：使用app属性的时候需要先引入app的命名空间

xmlns:app="http://schemas.android.com/apk/res-auto"

<android.support.design.widget.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:layout_below="@id/rl_topbar"
        app:tabBackground="@color/topBarBackgound"
        app:tabIndicatorColor="@color/tabTextChenked"
        app:tabSelectedTextColor="@color/tabTextChenked"
        app:tabIndicatorHeight="2dp"
        app:tabTextColor="@color/topBarText"

        >

    </android.support.design.widget.TabLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager_tab"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/tabLayout">

    </android.support.v4.view.ViewPager>

四、定义类继承FragmentPagerAdapter

public class TabAdapter extends FragmentPagerAdapter {
//tab文字标题
    private String[] mTabData;
//需要显示的Fragment的集合
    private List<Fragment> mfragmentList;

    public TabAdapter(FragmentManager fm,String[] tabData,List<Fragment> fragmentList) {
        super(fm);
        this.mTabData = tabData;
        this.mfragmentList = fragmentList;
    }
//根据position返回需要显示的Fragment
    @Override
    public Fragment getItem(int position) {
        return mfragmentList.get(position);
    }
//获取需要显示Fragment的数据量，有几个标题就肯定有几个Fragment，所以直接拿数组的长度就可以了
    @Override
    public int getCount() {
        return mTabData.length;
    }
//返回tab的标题文字数据
    @Override
    public CharSequence getPageTitle(int position) {
        return mTabData[position];
    }
}

这里需要注意的是，我在编写的时候Fragment只能使用V4包下不然 Adapter中的getItem方法的返回类型会不一致。

五、代码中设置

//将需要显示的Fragment添加到集合当中
        fragmentList = new ArrayList<Fragment>();
        fragmentList.add(bbcSixminutesFragment);
        fragmentList.add(tunnelEnglishFragment);
        fragmentList.add(bbcNewsFragment);
        fragmentList.add(newsVocabularyFragment);


        //设置Tab
        TabAdapter tabAdapter = new TabAdapter(getSupportFragmentManager(),tabData,fragmentList);
        //设置ViewPager的适配器
        viewpager_tab.setAdapter(tabAdapter);

        //绑定Tab
        tabLayout.setupWithViewPager(viewpager_tab);