TabLayout定义下标宽度

最新推荐文章于 2025-05-15 21:28:39 发布

原创最新推荐文章于 2025-05-15 21:28:39 发布 · 置顶 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Android #TabLayout

TabLayout 专栏收录该内容

1 篇文章

订阅专栏

本文探讨了如何避免通过反射来改变TabLayout下标的宽度，指出这种方法可能导致Tab的点击范围缩小和显示问题。作者发现TabLayout的下标是通过绘制长方体实现的，并提出只需调整长方体的坐标即可解决问题。文章提供了修改后的代码，并已上传至GitHub，呼吁其他开发者尊重原创，保留源链接。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

原文链接：https://blog.youkuaiyun.com/qq_15736263/article/details/80972691

网上很多博客TabLayout定义下标宽度都是通过反射修改Tab的宽度实现的，实际效果就是Tab的点击范围变小，且这种方法下标最短宽度只能设置成最宽的Tab的宽度，体验效果很不好。

查看源码后发现其实就是在draw方法中画了一条长方体，包括动画也是这样实现的。

public void draw(Canvas canvas) {
    super.draw(canvas);
    if (this.mIndicatorLeft >= 0 && this.mIndicatorRight > this.mIndicatorLeft) {
        canvas.drawRect((float)this.mIndicatorLeft, (float)(this.getHeight() - this.mSelectedIndicatorHeight), (float)this.mIndicatorRight, (float)this.getHeight(), this.mSelectedIndicatorPaint);
    }
}

那我们明白了，只需要修改这个长方体的左右坐标即可。

修改完成后代码如下

public void draw(Canvas canvas) {
    super.draw(canvas);
    if (this.mIndicatorLeft >= 0 && this.mIndicatorRight > this.mIndicatorLeft) {
        if (this.mSelectedIndicatorWidth <= 0) {
            canvas.drawRect((float)this.mIndicatorLeft, (float)(this.getHeight() - this.mSelectedIndicatorHeight), (float)this.mIndicatorRight, (float)this.getHeight(), this.mSelectedIndicatorPaint);
        } else {
            int left = (this.mIndicatorRight - this.mIndicatorLeft) / 2 - this.mSelectedIndicatorWidth / 2 + this.mIndicatorLeft;
            canvas.drawRect((float)left, (float)(this.getHeight() - this.mSelectedIndicatorHeight), (float)(left + this.mSelectedIndicatorWidth), (float)this.getHeight(), this.mSelectedIndicatorPaint);
        }
    }

}