欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

自定义TextView:打造渐变文本控件

程序员文章站 2022-06-01 11:34:29
...

相信大家都见过QQ空间黄钻专属的渐变文字展示,那么这种效果是怎么实现的呢?其实很简单,只需一小段代码就能实现文字渐变的效果。

Demo效果如图

自定义TextView:打造渐变文本控件

该效果是利用LinearGradient和Matrix来实现的

实现代码:

public class GradientTextView extends android.support.v7.widget.AppCompatTextView {

    private int mViewWidth;
    private LinearGradient mLinearGradient;
    private Paint mPaint;
    private Matrix mGradientMatrix;
    private int mTranslate;

    public GradientTextView(Context context) {
        super(context);
    }

    public GradientTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public GradientTextView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    /**
     * 在onDraw方法中,通过矩阵的方法来不断平移渐变效果,使绘制文字时产生动态的闪动效果
     */
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (mLinearGradient != null) {
            mTranslate += mViewWidth / 5;
            if (mTranslate > 2 * mViewWidth) {
                mTranslate = -mViewWidth;
            }
            //设置单位矩阵
            mGradientMatrix.setTranslate(mTranslate, 0);
            //为着色器设置矩阵
            mLinearGradient.setLocalMatrix(mGradientMatrix);
            //循环等待时间
            postInvalidateDelayed(100);
        }
    }

    /**
     * 先在onSizeChanged()方法中进行一些初始化工作,根据View的宽来设置一个LinearGradient渐变渲染器
     */
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        if (mViewWidth == 0) {
            mViewWidth = getMeasuredWidth();
            if (mViewWidth > 0) {
                //获取当前绘制TextView的Paint对象
                mPaint = getPaint();
                //自定义渐变渲染器
                mLinearGradient = new LinearGradient(
                        0, 0, mViewWidth, 0,
                        new int[]{Color.BLUE, 0xffffffff, Color.BLUE},//定义渐变颜色
                        null, Shader.TileMode.CLAMP);//Shader渲染器
                //为画笔设置渐变渲染器
                mPaint.setShader(mLinearGradient);
                //创建一个单位矩阵
                mGradientMatrix = new Matrix();
            }
        }
    }
}