Android-LinearGradient实现TextView字体渐变的效果

熟话说，没图我说个XX，所以我这儿配备一张动态图片：

看了这张效果图，你应该明天我们今天要做一个什么样的东西了。

首先，我们需要知道 LinearGradient这个 类：这个类叫作线性渲染，LinearGradient的作用是实现某一区域内颜色的线性渐变效果，及我们上面看到的效果，主要就是使用它来完成的。

然后，我们下面看下这个类的继承关系：

可以看出，这个类提供了两个构造方法：

参数说明：

参数x0：表示渐变的起始点x坐标；

参数y0：表示渐变的起始点y坐标；

参数x1：表示渐变的终点x坐标；

参数y1：表示渐变的终点y坐标；

参数colors：表示渐变的颜色数组；

参数positions：用来指定颜色数组的相对位置；

参数 color0： 表示渐变开始颜色；

参数 color1： 表示渐变结束颜色；

参数tile：表示平铺方式

Shader.TileMode有3种参数可供选择，分别为CLAMP、REPEAT和MIRROR：

CLAMP的作用：是如果渲染器超出原始边界范围，则会复制边缘颜色对超出范围的区域进行着色

REPEAT的作用是：在横向和纵向上以平铺的形式重复渲染位图

MIRROR的作用是：在横向和纵向上以镜像的方式重复渲染位图

注意：通常，参数positions设为null，表示颜色数组以斜坡线的形式均匀分布。

下面是源码：

public class GradientTextView extends TextView
{

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

	private boolean mAnimating = true;

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

	@Override
	protected void onSizeChanged(int w, int h, int oldw, int oldh)
	{
		super.onSizeChanged(w, h, oldw, oldh);
		if (mViewWidth == 0)
		{
			//getWidth得到是某个view的实际尺寸.
			//getMeasuredWidth是得到某view想要在parent view里面占的大小.
			mViewWidth = getMeasuredWidth();
			if (mViewWidth > 0)
			{
				mPaint = getPaint();
				//线性渐变
				mLinearGradient = new LinearGradient(-mViewWidth, 0, 0, 0, new int[]
				{ 0x33ffffff, 0xffffffff, 0x33ffffff }, new float[]
				{ 0, 0.5f, 1 }, Shader.TileMode.CLAMP);
				mPaint.setShader(mLinearGradient);
				mGradientMatrix = new Matrix();
			}
		}
	}

	@Override
	protected void onDraw(Canvas canvas)
	{
		super.onDraw(canvas);
		if (mAnimating && mGradientMatrix != null)
		{
			mTranslate += mViewWidth / 10;
			if (mTranslate > 2 * mViewWidth)
			{
				mTranslate = -mViewWidth;
			}
			mGradientMatrix.setTranslate(mTranslate, 0);
			mLinearGradient.setLocalMatrix(mGradientMatrix);
			//50ms刷新一次
			postInvalidateDelayed(50);
		}
	}

}

首先，在onSizeChanged()里面，测量child iew在parent view中占的宽度。

并且给LinearGradient设置渐变的颜色值，位置，以及初始渐变的位置。

这个渐变的初始位置是在手机屏幕的外面x=(-mViewWidth，０)就是屏幕外面，这个不难理解。

在onDraw()方法当中通过不断的绘制界面达到我们看到的动画效果，

mTranslate += mViewWidth / 10：表示每一次运动的递增值

if (mTranslate > 2 * mViewWidth)

   {

        mTranslate = -mViewWidth;

   }

这就是结束条件语句：当递增值大于两倍child view宽度时候，及回到屏幕的左边。

至此，整个就完成了我们开始在文章开头的效果了，你只需要在XML文件当中引用这个类即可。

demo地址：http://download.csdn.net/detail/poison_h/8722249