TabLayout简单使用

平常在看Android书的时候，觉得这个知识点我已经掌握不需要记录，或者在看别人写的blog的时候，发现他所讲的知识我已经有了一个印象，下次要用到这个知识的时候，我只有找到这篇blog就可以了，但是往往，这些基础的部分，因为内容多且杂，很长时间不用就会忘记，blog上的知识点也是，往往就是这篇blog找不到。so，我还是把在使用过程中遇到的知识点简单的记录一下，方便之后如果在忘记的回顾。

从官方教程开始

在官网的TabLayout官方API中对这个TabLayout控件的使用有简单的说明。我们可以单独得为TabLayout添加Tab控件：

 TabLayout tabLayout = ...; tabLayout.addTab(tabLayout.newTab().setText("Tab 1")); tabLayout.addTab(tabLayout.newTab().setText("Tab 2")); tabLayout.addTab(tabLayout.newTab().setText("Tab 3"))

这样的效果如图：

我们能够，看到在上面三个Tab显示。但是我们在一般情况下都是和ViewPager这个控件一起使用。在官方指导文档中，也提供了对应的布局提示:

 <android.support.v4.view.ViewPager     android:layout_width="match_parent"     android:layout_height="match_parent">     <android.support.design.widget.TabLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_gravity="top" /> </android.support.v4.view.ViewPager>

但是在个人使用的时候，也可以使用如下布局：

    <android.support.design.widget.TabLayout        android:id="@+id/tablayout"        android:layout_width="match_parent"        android:layout_height="wrap_content"></android.support.design.widget.TabLayout>    <android.support.v4.view.ViewPager        android:id="@+id/viewpager"        android:layout_width="match_parent"        android:layout_height="match_parent">    </android.support.v4.view.ViewPager>

这两种布局简单的实现出来的效果看起来都是差不多的，具体有什么不同暂时还不清楚。等之后什么时候弄清楚了在另行说明。但在仅仅这样写布局还是实现不了上面图片所示的效果。在官方的文档上有说需要调用setupWithViewPager(ViewPager)来为TabLayout设置ViewPager。在调用这个方法后，需要使用setAdapter(PageAdapter)来为ViewPager设置适配器。

适配器代码：(比较简单的实现)

public class ViewPagerAdapter extends FragmentPagerAdapter {    private List<Fragment>  fragments;    private List<String> titles;    /**     * 构造方法     * @param manager     * @param fragments     */    public ViewPagerAdapter(FragmentManager manager, List<Fragment> fragments,List<String> titles){        super(manager);        this.fragments=fragments;        this.titles=titles;    }    @Override    public int getCount() {        if (fragments!=null){            return fragments.size();        }        return 0;    }    @Override    public Fragment getItem(int position) {        if (fragments!=null){            return fragments.get(position);        }        return null;    }    @Override    public CharSequence getPageTitle(int position) {        if (titles!=null){            return titles.get(position);        }        return "";    }}

MainActivity代码：

public class MainActivity extends AppCompatActivity {    private ViewPager mViewPager;    private TabLayout mTabLayout;    private FragmentPagerAdapter mAdapter;    private List<Fragment> fragments;    private List<String> titles;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mViewPager = (ViewPager) findViewById(R.id.viewpager);        mTabLayout = (TabLayout) findViewById(R.id.tablayout);        mTabLayout.setupWithViewPager(mViewPager);        fragments = new ArrayList<Fragment>();        Fragment aFragment = AFragment.getInstance();        Fragment bFragment = BFragment.getInstance();        Fragment cFragment = CFragment.getInstance();        Fragment dFragment = DFragment.getInstance();        Fragment eFragment = EFragment.getInstance();        fragments.add(aFragment);        fragments.add(bFragment);        fragments.add(cFragment);        fragments.add(dFragment);        fragments.add(eFragment);        titles = new ArrayList<String>();        titles.add("A");        titles.add("B");        titles.add("C");        titles.add("D");        titles.add("E");        mAdapter = new ViewPagerAdapter(getSupportFragmentManager(), fragments, titles);        mViewPager.setAdapter(mAdapter);        mTabLayout.setTabMode(TabLayout.MODE_FIXED);    }}

所有的Fragment的的布局非常简单，就是一个居中的TextView,这样简单的代码就能够实现如下动图的效果

so easy ！不是吗？

错误

因为很久没有用这个控件了，我一直记得是ViewPager和TabLayout两个控件的嵌套使用，因此我尝试把ViewPager嵌套在TabLayout中使用，很高兴的去运行了一把，以为能够成功，自己还是too young too simple。studio立马就给我报如下的错误：

Binary XML file line #11: Only TabItem instances can be added to TabLayout

错误的信息也说得很明白了，在TabLayout控件中只能够放TabItem控件。

其他姿势

之前也写过一片关于FragmentTabLayout控件的简单使用，在那篇文章中，我说道，在FragmentTabLayout中的Fragment不需要进行懒加载，因为FragmentTabLayout没有预加载这一个概念，但是在这个情况下，如果每个界面都有大量的请求，最好还是使用Fragment的懒加载。