TabLayout和ViewPager+Fragment做滑动栏

不念不忘少年蓝@ 2022-06-13 04:12 214阅读 0赞

# TabLayout和ViewPager+Fragment做滑动栏 #

1.在Activity中需要配置一下

private void initView() {
        mTabLayout = (TabLayout) findViewById(R.id.tl_guide_title);
        mViewPager = (ViewPager) findViewById(R.id.vp_guide_content);
    
        //设置ViewPager适配器
        mAdapter = new TabFragmentPagerAdapter(getSupportFragmentManager()
                , getData());
        mViewPager.setAdapter(mAdapter);
    
        //绑定ViewPager
        mTabLayout.setupWithViewPager(mViewPager);
    
        //表示每个标签都保持自身宽度，一旦标签过多，给标题栏提供支持横向滑动的功能
        mTabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
    
        mTabLayout.setBackgroundColor(Color.parseColor("#303F9F"));
    }
    
    /**
     * 创造数据的方法(自己造的  其实本来这里应该从网络获取)
     * @return
     */
    private List<TabData> getData() {
        List<TabData> dataList = new ArrayList<>();
        dataList.add(new TabData(0,"社会"));
        dataList.add(new TabData(1,"科技"));
        dataList.add(new TabData(2,"头条"));
        dataList.add(new TabData(3,"IT"));
        dataList.add(new TabData(4,"华为"));
        dataList.add(new TabData(5,"最新"));
        dataList.add(new TabData(6,"上热评"));
        dataList.add(new TabData(7,"国内"));
        dataList.add(new TabData(8,"国际"));
        return dataList;
    }

2.布局

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:orientation="vertical"
        tools:context="com.xfhy.day03.activity.HomeActivity">
    
        <android.support.design.widget.TabLayout
            android:id="@+id/tl_guide_title"
            android:layout_width="match_parent"
            app:tabTextColor="#7dffffff"
            app:tabSelectedTextColor="#ffffff"
            android:layout_height="55dp"/>
    
        <android.support.v4.view.ViewPager
            android:id="@+id/vp_guide_content"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>
    
    </LinearLayout>

3.adapter

public class HomeSwitchPagerAdapter extends FragmentPagerAdapter {
    
        private List<Fragment> dataList;
    
        public HomeSwitchPagerAdapter(FragmentManager fm, List<Fragment> dataList) {
            super(fm);
            this.dataList = dataList;
        }
    
        @Override
        public Fragment getItem(int position) {
            if (dataList != null && dataList.size() > position) {
                Fragment fragment = dataList.get(position);
                return fragment;
            }
            return null;
        }
    
        @Override
        public int getCount() {
            return dataList != null ? dataList.size() : 0;
        }
    }

# 小东西 #

*  TabLayout 小技巧 //表示每个标签都保持自身宽度，一旦标签过多，给标题栏提供支持横向滑动的功能 mTabLayout.setTabMode(TabLayout.MODE\_SCROLLABLE);