Tablayout +viewpage简单实用

 对应的依赖

   implementation 'com.android.support:design:25.+'

下面是对应的主布局  样式属性自己定义  style 以及color

<?xml version="1.0" encoding="utf-8"?>
<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=".memberCenter.ui.CollectActivity">
    <include layout="@layout/toorbar_back" />

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="40dp">

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

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

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

</LinearLayout>

下面是主页面 里面 是内部类

public class CollectActivity extends BaseActivity {

    private ViewPager pager;

    private TabLayout tabLayout;
    MyViewPagerAdapter myViewPagerAdapter;

    private Fragment[] mFragmentArrays = new Fragment[5];

    private String[] mTabTitles = new String[5];


    @Override
    protected boolean ActivityIsBackUp() {
        return true;
    }

    @Override
    protected String ActivityTitle() {
        return "我的收藏";
    }



    protected void initView() {
        pager = (ViewPager) findViewById(R.id.page);
        tabLayout = (TabLayout) findViewById(R.id.tab_layout);

        mTabTitles[0] = "文章";
        mTabTitles[1] = "专题";
        mTabTitles[2] = "图集";
        mTabTitles[3] = "视频";
        mTabTitles[4] = "直播";

        //设置tablayout距离上下左右的距离
        //tab_title.setPadding(20,20,20,20);
        mFragmentArrays[0] = TabFragment.newInstance();
        mFragmentArrays[1] = CeFragment.newInstance();
        mFragmentArrays[2] = TabFragment.newInstance();
        mFragmentArrays[3] = TabFragment.newInstance();
        mFragmentArrays[4] = TabFragment.newInstance();
      //  PagerAdapter pagerAdapter = new MyViewPagerAdapter(getSupportFragmentManager());
        myViewPagerAdapter=new MyViewPagerAdapter(getSupportFragmentManager());
        pager.setAdapter(myViewPagerAdapter);
        //将ViewPager和TabLayout绑定
        tabLayout.setupWithViewPager(pager);
    }

    @Override
    protected void initData() {

    }

    @Override
    protected int getContentViewLayoutID() {
        return R.layout.activity_collect;
    }

    @Override
    protected void getBundleExtras(Bundle extras) {

    }

    @Override
    protected boolean isHideNavigation() {
        return false;
    }
    class MyViewPagerAdapter extends FragmentPagerAdapter {
        public MyViewPagerAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public Fragment getItem(int position) {
            return mFragmentArrays[position];
        }


        @Override
        public int getCount() {
            return mFragmentArrays.length;
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mTabTitles[position];

        }
    }

}

接下来是对应的 每个页面的fragment 页面我这边是只写了一个 ，根据自己的需求修改

public class TabFragment extends Fragment {
    public static Fragment newInstance() {
        TabFragment fragment = new TabFragment();
        return fragment;
    }
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.fragment_tab, container, false);
   /*     RecyclerView recyclerView = (RecyclerView) rootView.findViewById(R.id.recycler);
        LinearLayoutManager layoutManager = new LinearLayoutManager(getActivity());
        layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
        recyclerView.setLayoutManager(layoutManager);
        recyclerView.setAdapter(new RecyclerAdapter());*/
        return rootView;
    }


}

对应的fragment的布局

<?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">

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="关注"
        android:textSize="20sp"
        android:gravity="center"/>
</LinearLayout>