Android自定义Tablayout下划线指示器Indicator：设置宽高、圆角、渐变颜色

Android自定义Tablayout下划线指示器Indicator：设置宽高、圆角、渐变颜色

Android原生的Tablayout下面有一个指示器（指示线、下划线），如图所示：

详情见附录1。

但是Android原生的Tablayout指示器Indicator自定义空间很有限，能设置颜色，如果想把Tablayout指示器Indicator的宽和高做调整适应自己产品开发的UI设计要求，就很难办到了，更是如果要求的Indicator的指示器呈现渐变颜色、圆角，就难上加难了。就必须自己想办法解决这些自定义问题。

比如下面的这个设计要求：

UI设计师对指示器Indicator的宽、高、圆角都提出了规范要求。对于能自定义Indicator的宽、高、圆角及颜色的第三方开源项目很多。但是这次设计要求Indicator必须呈现出一定的颜色渐变，这就比较困难了，因为很多第三方开源的项目仅仅支持对Indicator设计一个单一的颜色，不支持多种颜色的渐变。

找来找去，我在github上找到了一个支持自定义Indicator的开源项目：

https://github.com/hackware1993/MagicIndicator 

但是若直接基于该项目对Indicator进行渐变颜色还是比较麻烦，比如，如果我想对Indicator进行自定义，就需要继承该项目的CommonNavigatorAdapter，然后在CommonNavigatorAdapter里面重写getIndicator，然后在getIndicator里面返回一个自定义的IPagerIndicator，麻烦就麻烦在继承实现IPagerIndicator对于底部下划线Indicator的onDraw方法，该方法将直接对Indicator底部的下划线指示器Indicator进行画线画圆操作等等，但是我的需求只是对一个圆角线性下划线指示器Indicator颜色渐变即可。
我仔细看了原作者的代码时候，终于找到一个简单的做法实现，就是在自定义IPagerIndicator的onDraw里面，对mPaint设置一个线性渐变LinearGradient即可，但是设置LinearGradient需要当前渐变的宽高坐标，而这部分宽高坐标取决于原项目中的mLineRect（mLineRect是一个RectF），该mLineRect代表了真正要绘制下划线指示器Indicator的区域，然而，如果有这个对象，我直接就可以在onDraw里面根据mLineRect获取四个空间位置点，然后构造线性渐变LinearGradient，进而设置给mPaint，就轻松实现颜色渐变了，这样的实现方案最大好处就是无须对原项目做二次复杂定制化开发。

但是遗憾的是，原作者在原项目中把mLineRect设置为私有private性质，且没有提供public的get方法，因此，我把原作者的LinePagerIndicator重新拉下来，增加了一个公开方法，把mLineRect返回，

    /**
     * 返回底部画线的RectF mLineRect。
     *
     * @return
     */
    public RectF getLineRect() {
        return mLineRect;
    }

作为对LinePagerIndicator的扩展，最终的LinePagerIndicatorEx.java：

package zhangphil.test;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.view.View;
import android.view.animation.Interpolator;
import android.view.animation.LinearInterpolator;

import net.lucode.hackware.magicindicator.FragmentContainerHelper;
import net.lucode.hackware.magicindicator.buildins.ArgbEvaluatorHolder;
import net.lucode.hackware.magicindicator.buildins.UIUtil;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.abs.IPagerIndicator;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.model.PositionData;

import java.util.Arrays;
import java.util.List;

public class LinePagerIndicatorEx  extends View implements IPagerIndicator {
    public static final int MODE_MATCH_EDGE = 0;   // 直线宽度 == title宽度 - 2 * mXOffset
    public static final int MODE_WRAP_CONTENT = 1;    // 直线宽度 == title内容宽度 - 2 * mXOffset
    public static final int MODE_EXACTLY = 2;  // 直线宽度 == mLineWidth

    private int mMode;  // 默认为MODE_MATCH_EDGE模式

    // 控制动画
    private Interpolator mStartInterpolator = new LinearInterpolator()