TabLayout设置setupWithViewPager出现的问题

最近项目中使用了android design包中得TabLayout+ViewPager，和大家分享一下我发现了一个的问题。当通过TabLayout.newTab之后，然后通过setupWithViewPager将TabLayout和ViewPager建立关联，这时会发现之前设置的tab消失了，具体的代码和如何查找源码解决见如何代码：

• 示例代码

mTl = (TabLayout) findViewById(R.id.id_tablayout);
mVp = (ViewPager) findViewById(R.id.id_vp);
//添加两个tab
mTl.addTab(mTl.newTab().setText("登陆"));
mTl.addTab(mTl.newTab().setText("注册"));
//让tablayout与viewpager建立关联关系
//mTl.setupWithViewPager(mVp);
mVp.setAdapter(new PagerAdapter() {
    @Override
    public int getCount() {
        return 2;
    }
    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == object;
    }
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        TextView textView = new TextView(container.getContext());
        textView.setText("position:" + position);
        container.addView(textView);
        return textView;
    }
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((View) object);
    }
});

上面的代码运行之后，看起来好像没有什么问题，但是我一滑动viewpager发现，viewpager是可以正常的滑动切换不同的view，但是顶部的tab并没有跟着滑动。

• 解决viewpager与tablayout一起滑动

//让tablayout与viewpager建立关联关系
mTl.setupWithViewPager(mVp);

在tablayout中添加这段代码，将viewpager与tablayout建立关联。但是又发现一个问题，我之前调用addTab(mTl.newTab().setText("登陆"))的两个tab的数据呢？怎么没了？分析一下，我没有对viewpager和tablayout建立关系时，不会有这个问题，一建立联系就会出现问题，那么我们来瞅瞅mTl.setupWithViewPager(mVp);实现机制。

• 跟进源码setupWithViewPager探究

//...省略一部分代码
//处理从方法中传入的viewpager
if (viewPager != null) {
    mViewPager = viewPager;
    
    //①以下这部分代码是处理一些滑动的关联关系。例如滑动监听
    // Add our custom OnPageChangeListener to the ViewPager
    if (mPageChangeListener == null) {
        mPageChangeListener = new TabLayoutOnPageChangeListener(this);
    }
    mPageChangeListener.reset();
    viewPager.addOnPageChangeListener(mPageChangeListener);
    // Now we'll add a tab selected listener to set ViewPager's current item
    mCurrentVpSelectedListener = new ViewPagerOnTabSelectedListener(viewPager);
    addOnTabSelectedListener(mCurrentVpSelectedListener);
    
    //②以下这部分代码就可以解释为什么我们的tab设置的内容会不见了
    final PagerAdapter adapter = viewPager.getAdapter();
    if (adapter != null) {
        // Now we'll populate ourselves from the pager adapter, adding an observer if
        // autoRefresh is enabled
        //将外部设置给viewpager的adapter取出来通过setPagerAdapter重新设置
        setPagerAdapter(adapter, autoRefresh);
    }
    ...
    }
    ...
} 
void setPagerAdapter(@Nullable final PagerAdapter adapter, final boolean addObserver) {
    if (mPagerAdapter != null && mPagerAdapterObserver != null) {
        // If we already have a PagerAdapter, unregister our observer
        mPagerAdapter.unregisterDataSetObserver(mPagerAdapterObserver);
    }
    //注册observer
    mPagerAdapter = adapter;
    if (addObserver && adapter != null) {
        // Register our observer on the new adapter
        if (mPagerAdapterObserver == null) {
            mPagerAdapterObserver = new PagerAdapterObserver();
        }
        adapter.registerDataSetObserver(mPagerAdapterObserver);
    }
    // Finally make sure we reflect the new adapter
    //关键代码
    populateFromPagerAdapter();
}

void populateFromPagerAdapter() {
    //移除所有的tab
    //我们之前设置的tab就是在这里被移除的
    removeAllTabs();
    if (mPagerAdapter != null) {
        final int adapterCount = mPagerAdapter.getCount();
        for (int i = 0; i < adapterCount; i++) {
           //重新添加tab，而setText得内容是在PagerAdapter中getPageTitle获取的，因此问题的答案就已经很明显了。 addTab(newTab().setText(mPagerAdapter.getPageTitle(i)), false);
        }
        // Make sure we reflect the currently set ViewPager item
        if (mViewPager != null && adapterCount > 0) {
            final int curItem = mViewPager.getCurrentItem();
            if (curItem != getSelectedTabPosition() && curItem < getTabCount()) {
                selectTab(getTabAt(curItem));
            }
        }
    }
}

• 修改代码显示tab内容

在Adapter中复写PagerAdapter中的getPageTitle方法就可以了，看过上面的源码可以知道在mVp和mTl建立联系之后，会将设置给TabLayout的tab清除，并且重写的创建，因此就没有必要手动的去创建Tab了。

@Override
public CharSequence getPageTitle(int position) {
    if(position ==0) {
        return "登陆";
    }else {
        return "注册";
    }