关于CommonTabLayout实现首页菜单栏滑动点击切换关于CommonTabLayout实现首页菜单

前几天在网上看到FlycoTabLayout这个库，功能非常强大，里面也有三个控件，有兴趣的小伙伴可以看看Github的开源库FlycoTabLayout地址，这里只介绍CommonTabLayout这种，替换传统TabLayout + ViewPager + Fragment ，不需要太复杂的繁琐设置，也无需创建Drawable文件，所以这里还是有必要记录一下，这里为大家分享首页菜单栏切换，CommonTabLayout+ViewPager可实现滑动点击切换页面效果下面贴依赖出来

implementation 'com.flyco.tablayout:FlycoTabLayout_Lib:2.0.2@aar'

【关于CommonTabLayout实现首页菜单栏滑动点击切换】CommonTabLayout + ViewPger滑动切换

首先MainActivity的布局文件，很简单只有一个ViewPager + CommonTabLayout，如下：

接着MainActivity的Java文件，如下：

public class MainActivity extends AppCompatActivity {private ArrayList selectedIconRes = new ArrayList<>(); //tab选中图标集合 private ArrayList unselectedIconRes = new ArrayList<>(); //tab未选中图标集合 private ArrayList titleRes = new ArrayList<>(); //tab标题集合 private ArrayList fsRes = new ArrayList<>(); //fragment集合 private List data = https://www.it610.com/article/new ArrayList<>(); //CommonTabLayout 所需数据集合 private CommonTabLayout mLayout; private ViewPager mPager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); initData(); initListener(); }/** * 初始化控件 */ private void initView() { mLayout = findViewById(R.id.m_layout); mPager = findViewById(R.id.m_pager); }/** * 初始化数据 */ private void initData() { //图片选中资源 selectedIconRes.add(R.mipmap.home_red); selectedIconRes.add(R.mipmap.msg_red); selectedIconRes.add(R.mipmap.my_red); //图片未选中资源 unselectedIconRes.add(R.mipmap.home_gray); unselectedIconRes.add(R.mipmap.msg_gray); unselectedIconRes.add(R.mipmap.my_gray); //标题资源 titleRes.add("首页"); titleRes.add("消息"); titleRes.add("我的"); //fragment数据 fsRes.add(new HomeFragment()); fsRes.add(new MsgFragment()); fsRes.add(new MyFragment()); //设置数据 for (int i = 0; i < titleRes.size(); i++) { final int index = i; data.add(new CustomTabEntity() { @Override public String getTabTitle() { return titleRes.get(index); }@Override public int getTabSelectedIcon() { return selectedIconRes.get(index); }@Override public int getTabUnselectedIcon() { return unselectedIconRes.get(index); } }); } //设置数据 mLayout.setTabData((ArrayList) data); mPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager(),fsRes)); }/** * 初始化监听 */ private void initListener() { //TabLayout监听 mLayout.setOnTabSelectListener(new OnTabSelectListener() { @Override public void onTabSelect(int position) { //显示相应的item界面 mPager.setCurrentItem(position); }@Override public void onTabReselect(int position) {} }); //ViewPager监听 mPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int i, float v, int i1) {}@Override public void onPageSelected(int i) { //设置相应选中图标和颜色 mLayout.setCurrentTab(i); }@Override public void onPageScrollStateChanged(int i) {} }); //设置默认第0个 mPager.setCurrentItem(0); } }

ViewPager适配器如下：

public class MyPagerAdapter extends FragmentPagerAdapter {private ArrayList fs; public MyPagerAdapter(FragmentManager fm,ArrayList fs) { super(fm); this.fs = fs; }@Override public Fragment getItem(int i) { return fs.get(i); }@Override public int getCount() { return fs.size(); } }