自定义Tablayout下线的宽度

最新推荐文章于 2024-04-06 12:27:19 发布

ITKobi小丸子

最新推荐文章于 2024-04-06 12:27:19 发布

阅读量496

点赞数

分类专栏： Utils 文章标签： tablelayout 自定义下划线

本文链接：https://blog.csdn.net/wmz199123/article/details/78132540

版权

Utils 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

好久没写博客了,这次写一遍关于自定义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);

最后看看效果图如下:
这里写图片描述