自定义Tablayout下线的宽度

好久没写博客了,这次写一遍关于自定义Tablayout下划线宽度的文章.对于Tablayout大家一个非常的熟悉.在使用的时候一般是与ViewPager连用.但是原生的Tablayout的下滑线的宽度是根据你的Tab的宽度来匹配的.有时就会觉得很丑,觉得下滑线的宽度太大了.主要原生的Tablayout有没有属性去设置下划线宽度的方法.所有只能去自己去手动的去设置.说了这么多,主要的代码如下:

这里我定义了一个工具类 可以直接拷贝直接用:

public class TablayoutUtils {    public static void reflex(final TabLayout tabLayout){        //了解源码得知 线的宽度是根据 tabView的宽度来设置的        tabLayout.post(new Runnable() {            @Override            public void run() {                try {                    //拿到tabLayout的mTabStrip属性                    Field mTabStripField = tabLayout.getClass().getDeclaredField("mTabStrip");                    mTabStripField.setAccessible(true);                    LinearLayout mTabStrip = (LinearLayout) mTabStripField.get(tabLayout);                    int dp10 = dip2px(tabLayout.getContext(), 10);                    for (int i = 0; i < mTabStrip.getChildCount(); i++) {                        View tabView = mTabStrip.getChildAt(i);                        //拿到tabView的mTextView属性                        Field mTextViewField = tabView.getClass().getDeclaredField("mTextView");                        mTextViewField.setAccessible(true);                        TextView mTextView = (TextView) mTextViewField.get(tabView);                        tabView.setPadding(0, 0, 0, 0);                        //因为我想要的效果是   字多宽线就多宽，所以测量mTextView的宽度                        int width = 0;                        width = mTextView.getWidth();                        if (width == 0) {                            mTextView.measure(0, 0);                            width = mTextView.getMeasuredWidth();                        }                        //设置tab左右间距为10dp  注意这里不能使用Padding 因为源码中线的宽度是根据 tabView的宽度来设置的                        LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) tabView.getLayoutParams();                        params.width = width ;                        params.leftMargin = dp10;                        params.rightMargin = dp10;                        tabView.setLayoutParams(params);                        tabView.invalidate();                    }                } catch (NoSuchFieldException e) {                    e.printStackTrace();                } catch (IllegalAccessException e) {                    e.printStackTrace();                }            }        });    }    public static int dip2px(Context context, float dipValue) {        final float scale = context.getResources().getDisplayMetrics().density;        return (int) (dipValue * scale + 0.5f);    }}

使用时只要调用该方法就行,代码如下

  for (int i = 0; i < mItemName.size(); i++) {            mBrandActivityTab.addTab(mBrandActivityTab.newTab().setCustomView(getTabView(i)));        }        //注意这方法要在addTab()方法只需完成之后,调用才能起到作用       TablayoutUtils.reflex(mBrandActivityTab);

最后看看效果图如下:

看上面的图,上面是使用的是自定的宽度,下面是没有使用的效果.是不是使用之后瞬间小清新了.这样自定的Tablayout下滑先宽度就完成了.希望这边博客对你有所帮助谢谢!!!!!

---