TabLayout的使用和踩过的坑

在2015年的google大会上，google发布了新的Android Support Design库，里面包含了几个新的控件，其中就有一个TabLayout,TabLayout能够实现叶签效果，在这之前，我们一般使用的是开源框架ViewPagerIndicator、TabPageIndicator或者是RadioButton来实现单选效果，现在我们就来介绍他和viewpager的搭配使用。

首先我们先来看看效果图：

一、在gradle中添加依赖：
    compile 'com.android.support:design:26.0.0-alpha1'

二、xml中使用

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/coordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#fff">
        </android.support.design.widget.TabLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
    </android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>

    相关样式设置：
    设置背景:android:background="#fff"
    设置底部下划线颜色：app:tabIndicatorColor="#f00"
    设置选中后标签字体的颜色：app:tabSelectedTextColor="@android:color/holo_purple"
    设置默认标签字体颜色 ：app:tabTextColor="#cccccc"
    设置下划线的高度：app:tabIndicatorHeight="3dp";为0可以隐藏
    设置显示的Tab的宽度：app:tabMaxWidth="100dp"
    设置显示Tab的横条：
    app:tabMode="fixed" ;//横条固定（默认）
    app:tabMode="scrollable";//横条支持滑动
    注意：
    (1)下划线的长度没有提供相关方法设置。

    (2) app:layout_behavior="@string/appbar_scrolling_view_behavior"不写会导致ViewPager充满屏幕。

三、activity中使用
    1、TabLayout可以脱离ViewPager单独使用，使用方法如下：

    TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
    tabLayout.addTab(tabLayout.newTab().setText("首页"));
    tabLayout.addTab(tabLayout.newTab().setText("下载"));
    tabLayout.addTab(tabLayout.newTab().setText("上传"));

    2、单独使用作用不大，在实际开发中基本上都是和ViewPager搭配使用

        MyAdapter myAdapter =new MyAdapter(getSupportFragmentManager());
        tabLayout.setupWithViewPager(viewPager);//viewpager进行绑定
        viewPager.setAdapter(myAdapter);

        private static final String[] TILEE = {"首页","下载","上传"};
        class MyAdapter extends FragmentPagerAdapter{

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

            @Override
            public Fragment getItem(int position) {
                return new Fragment();
            }

            @Override
            public int getCount() {
                return 3;
            }

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

    注意 ： 有人没有重写getPageTitle方法，直接在tabLayout.addTab(tabLayout.newTab().setText("首页"));里面进行标题设置，会无法显示标题内容，ViewPager也无法展示数据，会出现如下情况

原因是：再一次调用为tablayout设置适配器的时候，tablayout做了一次清空tab的处理。

其他属性设置：

默认选中：tablayout.getTabAt(position).select();

选中监听：

        tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                Toast.makeText(MainActivity.this,tab.getPosition()+"tabLayout",Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });