TabLayout和viewpager联动知识点(基础)

总结一下TabLayout和ViewPager的联动

先看看效果图（简单）

这就是简单的效果图

1.导入依赖

compile 'com.android.support:design:28+'

2.在xml文件里的布局

    <android.support.design.widget.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="50dp">
    </android.support.design.widget.TabLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v4.view.ViewPager>

3.MainActivity的代码

public class Frag1 extends Fragment {

    ArrayList<String> slist = new ArrayList<String>();
    ArrayList<Fragment> flist = new ArrayList<Fragment>();
    private TabLayout tabLayout;
    private ViewPager pager;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.frag1,container,false);
        //tablayout和pager
        initData();
        tabLayout = view.findViewById(R.id.tabLayout);
        pager = view.findViewById(R.id.pager);
        pager.setAdapter(new             
        FragmentPagerAdapter(getActivity().getSupportFragmentManager()) {

            @Override
            public int getCount() {
                return slist.size();
            }


            @Override
            public Fragment getItem(int i) {
                return flist.get(i);
            }

            @Nullable
            @Override
            public CharSequence getPageTitle(int position) {
                return slist.get(position);
            }
        });
        tabLayout.setTabMode(TabLayout.MODE_FIXED);
        tabLayout.setupWithViewPager(pager);
        return view;
    }

    private void initData() {
        for (int i = 0 ; i < 5 ; i ++){
            slist.add("标题"+(i+1));
        }
        for (int i = 0 ; i < 5 ; i ++){
            flist.add(new FFrag()//这是新建的一个fragment);
        }
    }
}

简单的联动效果就实现了（有什么疑惑可以评论，一一解答）