Android修改TabLayout中indicator的宽度

设计嫌自带的Indicator宽度太长了,能改的咱做开发的也得尽力改是不是,去搜索一翻,官方的API里没找到设置宽度的。再Google一下,找到个不错的方法,地址,方法也比较简单,用反射修改。

private void setUpIndicatorWidth(TabLayout tabLayout, int marginLeft, int marginRight) {
        Class tabLayoutClass = tabLayout.getClass();
        Field tabStrip = null;
        try {
            tabStrip = tabLayoutClass.getDeclaredField("mTabStrip");
            tabStrip.setAccessible(true);
        } catch (NoSuchFieldException e) {
            e.printStackTrace();
        }

        LinearLayout layout = null;
        try {
            if (tabStrip != null) {
                layout = (LinearLayout) tabStrip.get(tabLayout);
            }
            for (int i = 0; i < layout.getChildCount(); i++) {
                View child = layout.getChildAt(i);
                child.setPadding(0, 0, 0, 0);
                LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT, 1);
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
                    params.setMarginStart(DensityUtil.dp2px(getActivity(), marginLeft));
                    params.setMarginEnd(DensityUtil.dp2px(getActivity(), marginRight));
                }
                child.setLayoutParams(params);
                child.invalidate();
            }
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        }
    }

但是本着学习的目的,不能复制上,能用就不管了,还是看看为什么这样做就成了吧。
在上面的代码里,我们可以看到主要是对"mTabStrip"这个域进行操作,那么"mTabStrip"是个什么类型的值呢?点开源码,发现这是一个SlidingTabStrip类的对象。而SlidingTabStrip是继承LinearLayout的,也就是说这是Indicator的容器类。通过layout = (LinearLayout) tabStrip.get(tabLayout)拿到了mTabStrip并将其转型成LinearLayout。接下来我们就可以修改indicator的宽度了。
通常ViewGroup是不会绘制自身的,但是在SlidingTabStrip的构造函数里有一句setWillNotDraw(false),这样ViewGroup就会调用复写的onDraw方法,先看下onDraw 方法里都有些什么吧。

@Override
public void draw(Canvas canvas) {
    super.draw(canvas);

    // Thick colored underline below the current selection
    if (mIndicatorLeft >= 0 && mIndicatorRight > mIndicatorLeft) {
        canvas.drawRect(mIndicatorLeft, getHeight() - mSelectedIndicatorHeight,
                        mIndicatorRight, getHeight(), mSelectedIndicatorPaint);
    }
}

方法很简单,只有绘制矩形这一行代码。决定indicator的宽度的参数是 mIndicatorLeftmIndicatorRight。类文件开头这两个值都被赋值为-1,接着找这两个参数在哪里被修改过值,在setIndicatorPosition方法中发现了这两个值被修改过。

void setIndicatorPosition(int left, int right) {
    if (left != mIndicatorLeft || right != mIndicatorRight) {
        // If the indicator's left/right has changed, invalidate
        mIndicatorLeft = left;
        mIndicatorRight = right;
        ViewCompat.postInvalidateOnAnimation(this);
    }
}

setIndicatorPostion 这个方法在updateIndicatorPositionanimatedIndicatorToPosition 方法中被调用,后者是在tab切换时调用的,暂时可以不用去管,只需要看updateIndicatorPostion 方法中的left和right值是怎么来的就行了。

private void updateIndicatorPosition() {
    final View selectedTitle = getChildAt(mSelectedPosition);
    int left, right;

    if (selectedTitle != null && selectedTitle.getWidth() > 0) {
        left = selectedTitle.getLeft();
        right = selectedTitle.getRight();

        if (mSelectionOffset > 0f && mSelectedPosition < getChildCount() - 1) {
            // Draw the selection partway between the tabs
            View nextTitle = getChildAt(mSelectedPosition + 1);
             left = (int) (mSelectionOffset * nextTitle.getLeft() +
                            (1.0f - mSelectionOffset) * left);
             right = (int) (mSelectionOffset * nextTitle.getRight() +
                            (1.0f - mSelectionOffset) * right);
         } else {
             left = right = -1;
         }

         setIndicatorPosition(left, right);
    }
}

可以看出来left和right先是分别等于tab标签的left和right,这个view充满整个tab,因此拿到的left和right是tab的最左边和最右边。里面的一个if条件是在indicator滑动的时候用来更新left和right的值的,这里也可以暂时不去理睬。这也就是indicator的宽度与tab长度相等的原因。这也就是说,无法通过直接修改mIndicatorLeft和mIndicatorRight的值来达到目的(这是我个人的看法,如果有错误,望指出)。但是除此之外,还可以通过设置子view的margin来间接达到目的。代码在最开始已经给出。但是具体多少值能达到需要的效果还是需要调试的,也没办法保证在所有手机上都能达到相同的效果,不过也算是一个不错的解决方案了。

你可能感兴趣的:(Android修改TabLayout中indicator的宽度)