android 字体从左往右发光闪过

个人还是很看中用户体验这一方面,所以有时候使用别人开发的app(一些特效),自己也想打开思维,这是怎么实现的。

今天的效果是这样的,有一行字体以字体自身发亮的方式从左向右闪过。效果图如下:


这个我还没研究透彻(涉及到渲染、矩阵知识点--->这两个知识点是必学的),所以先上代码吧(有参考Goole及国内的文章,然后自己做了些注释):

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.widget.TextView;

/**
 * 闪耀字体(字体发光闪过,类似与歌词的进度)
 *
 * @params LinearGradient : 线性渲染
 * @params Paint : 画笔
 * @params Matrix : 矩阵
 *
 */

@SuppressLint("AppCompatCustomView")
public class ShiningFontView extends TextView{
    private Paint mPaint;
    private LinearGradient mLinearGradient;
    private Matrix mGradientMatrix;
    private int mViewWidth;
    private int mTranslate;

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

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

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

    @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) {
                mPaint = getPaint();
                /**
                 * LinearGradient源码秒速:
                 * 创建一个在直线上绘制线性渐变的着色器
                 * @param x0  梯度线起始点的x坐标
                 * @param y0  梯度线起始点的y坐标
                 * @param x1  梯度线末端的x坐标
                 * @param y1  梯度线末端的y坐标
                 * @param  colors  沿梯度线分布的颜色
                 * @param  positions   可能是空的。相对位置(0 . .1)每个相应颜色的颜色数组。如果这是null,那么颜色就会沿着梯度线均匀分布。
                 * @param  tile   着色器的模式
                 *
                 * LinearGradient构造方法中的参数int[] color:
                 * 第一个元素:发光字体闪过后所显示的字体颜色,这里给定与第三个元素一样
                 * 第二个元素:字体发光的颜色
                 * 第三个元素:原字体显示的颜色
                 *
                 * mViewWidth:设置发光的宽度
                 * */
                mLinearGradient = new LinearGradient(0, 0, mViewWidth, 0, new int[]{Color.BLACK, Color.WHITE, Color.BLACK}, null, Shader.TileMode.CLAMP);
                mPaint.setShader(mLinearGradient);
                mGradientMatrix = new Matrix();
            }
        }
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (mGradientMatrix != null) {
            mTranslate += mViewWidth / 5;
            if (mTranslate > 2 * mViewWidth) {
                mTranslate =- mViewWidth;
            }
            mGradientMatrix.setTranslate(mTranslate, 0);
            mLinearGradient.setLocalMatrix(mGradientMatrix);
            //. 控制闪过的时间
            postInvalidateDelayed(150);

        }
    }

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值