3. ViewPagerIndicator+ViewPager

ViewPagerIndicator是一个开源库，通过ViewPagerIndicator+ViewPager可以实现页面的点击和滑动效果，与UnderlinePageIndicator结合使用可以实现Tab下面的下划线滑动效果

3.1 导入ViewPagerIndicator

//在对应module添加即可
implementation 'com.mcxiaoke.viewpagerindicator:library:2.4.1'

3.2 主xml布局代码

<com.viewpagerindicator.TabPageIndicator
        android:id="@+id/ti_updatings"
        android:layout_width="match_parent"
        android:layout_height="35dp">
    </com.viewpagerindicator.TabPageIndicator>

    <com.viewpagerindicator.UnderlinePageIndicator
        android:id="@+id/underline_indicator"
        android:layout_width="fill_parent"
        android:layout_height="3dp"
        />

    <android.support.v4.view.ViewPager
        android:id="@+id/vp_updatings"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="6dp"
        android:layout_weight="1"></android.support.v4.view.ViewPager>

3.3 构建对应页面的xml布局文件

3.4 创建对应页面的类

public class FragmentUpdatings extends Fragment {

    private View currentView;
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

        currentView = inflater.inflate(R.layout.fragment_market_mine_goods_wwc,container,false);
        
        initView...
        initEvent...

        return  currentView;
    }

3.5 创建对应的FragmentPagerAdapter类

public class MarketInTabAdapter extends FragmentPagerAdapter {

    public static String[] TITLE_IN_MARKETIN = {"我要购入","我有闲置"};

    public MarketInTabAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int i) {
    	//返回对应创建的Fragment对象
        if(i == 0) {
            FragmentMarketInGR fragmentMarketInGR = new FragmentMarketInGR();
            return fragmentMarketInGR;
        } 
        ...
        return null;
    }

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

    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return TITLE_IN_MARKETIN[position];
    }
}

3.6 主页面中定义ViewPager、TabPageIndicator、UnserlinePageIndicator及对应的Adapter

private ViewPager vp_updatings;
private TabPageIndicator ti_updatings;
private MarketInTabAdapter mTabAdapter;
private UnderlinePageIndicator mUnderlinePageIndicator;

3.7 初始化对应的控件

vp_updatings = currentView.findViewById(R.id.vp_updatings);
ti_updatings = currentView.findViewById(R.id.ti_updatings);
mTabAdapter = new UpdatingsTabAdapter(getSupposeFragmentManager());
mUnderlinePageIndicator = currentView.findViewById(R.id.underline_indicator);

3.8 控件间链接

vp_updatings.setAdapter(mTabAdapter);//Viewpager设置适配器
ti_updatings.setViewPager(vp_updatings, 0);//Tab的初始位置

mUnderlinePageIndicator.setViewPager(vp_updatings);//为UnderIndicator设置ViewPager
mUnderlinePageIndicator.setFades(false);//一直显示
ti_updatings.setOnPageChangeListener(mUnderlinePageIndicator);//tab改变对应UnderIndicator改变