Android tablayout总结

复习了tablayout，随手一记，如果有问题，还请告知，谢谢！

一、改变TabLayout 下划线(Indicator)宽度

TabLayout我们再熟悉不过了，在开发中，像这种tab切换的需求都会用到TabLayout,它是由官方提供的一个控件，在support design 包中。使用起来非常简单方便，交互效果也很不错，能满足我们开发中95%的需求。但是它有一个缺陷：不能改变Tab下划线（Indicator）的宽度。本篇文章给你带来改变Tab下划线宽度的几种方式:

1 . 通过反射设置Tab下划线的宽度

public static void setTabWidth(final TabLayout tabLayout, final int padding) {
    tabLayout.post(new Runnable() {
        @Override
        public void run() {
            LinearLayout mTabStrip = (LinearLayout) tabLayout.getChildAt(0);
            for (int i = 0; i < mTabStrip.getChildCount(); i++) {
                View tabView = mTabStrip.getChildAt(i);
                tabView.setPadding(0, 0, 0, 0);
                LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) tabView.getLayoutParams();
                params.leftMargin = padding;
                params.rightMargin = padding;
                tabView.setLayoutParams(params);
                tabView.invalidate();
            }
        }
    });
}

传入参数即可。

2 . 通过TabLayout setCustomView 的方式 （注意下，自定义布局只能用linearlayout）

3 . 使用第三方开源库。

FlycoTabLayout https://github.com/H07000223/FlycoTabLayout

MagicIndicator https://github.com/hackware1993/MagicIndicator

4 . 通过属性，但是版本一定得高。

app:tabIndicatorFullWidth="false"

这个属性可以让你的tab选项卡的长度与下划线的长度一致

 

二、tablayout+viewpager标题不显示

tablayout使用setupwithViewpager()方法绑定ViewPager时候会造成tablayou.add（tablayout.newTab（""））添加标题的方法失效，不显示tablayout标题，原因是tablayout源码里面在关联viewpager的时候会走removeAllTabs的方法，清空所有tab；

（1）在setupWithViewPager方法后清空tab，在添加

tabLayout.setupWithViewPager(viewPager);

tabLayout.removeAllTabs();

for (int i = 0; i <tabs.length ; i++) {

tabLayout.addTab(tabLayout.newTab().setText(tabs[i]));

}

也可以通过tab.getTabAt重新设置，根据tab.gettabcount循环下，设置标题和图标

（2）FragmentpagerAdapter的getpageTitle方法中给tablayout赋值

class MyAdapter extends FragmentPagerAdapter{

public MyAdapter(FragmentManager fm) {

super(fm);

}

 

@Override

public Fragment getItem(int position) {

return list.get(position);

}

 

@Override

public CharSequence getPageTitle(int position) {

return tabs[position];

}

 

@Override

public int getCount() {

return list.size();

}

}

三、去掉水波纹

app:tabRippleColor="@null"