前言
根据启舰 的博客所学习的自定义View。
大家还记得gradient标签么？这里的LinearGradient的效果是线性渐变，可以设置多种颜色的渐变。
一、 初识LinearGradient
public LinearGradient(float x0, float y0, float x1, float y1,int color0, int color1, TileMode tile)
- (x0,y0): 起始渐变点坐标
- (x1,y1): 结束渐变点坐标
- color0:起始颜色，颜色值必须使用0xAARRGGBB形式的16进制表示！表示透明度的AA一定不能少
- color1:终止颜色
- TileMode tile：与BitmapShader一样，用于指定控件区域大于指定的渐变区域时，空白区域的颜色填充方法。忘记的，可以进入paint的各种方法的BitmapShader一节查看。
这里稍微提一下吧！⤵️
| 模式 | 效果 |
|---|---|
| Shader.TileMode.CLAMP | 会将边缘的一个像素进行拉伸、扩展 |
| Shader.TileMode.MIRROR | 镜面翻转 |
| Shader.TileMode.REPEAT | 平移复制 |
看了半天，这个明明只能设置两种颜色渐变吧，表担心，看这个
public LinearGradient(float x0, float y0, float x1, float y1,int colors[], float positions[], TileMode tile)
- (x0,y0): 起始渐变点坐标
- (x1,y1): 结束渐变点坐标
- colors[]: 用于指定渐变的颜色值数组，同样，颜色值必须使用0xAARRGGBB形式的16进制表示！表示透明度的AA一定不能少。
- positions[]: 与渐变的颜色相对应，取值是0-1的float类型，表示在每一个颜色在整条渐变线中的百分比位置
- TileMode tile：指定控件区域大于指定的渐变区域时，空白区域颜色填充方法。
这个构造函数则可以实现多种颜色渐变哦！
二、小试牛刀
//从红色到蓝色两色渐变，从（0，0）到（100，100）渐变，模式为平移复制
paint.setShader(new LinearGradient(0, 0, 100, 100, 0xffff0000, 0xff0000ff, Shader.TileMode.REPEAT));
canvas.drawRect(0, 0, 200, 200, paint);
canvas.translate(0,300);
//多色渐变
int[] colors = {0xffff0000,0xff00ff00,0xffff0000,0xffffff00,0xff0000ff};
float[] pos = {0f,0.2f,0.4f,0.6f,1.0f};
paint.setShader(new LinearGradient(0, 0, 100, 100, colors, pos, Shader.TileMode.REPEAT));
canvas.drawRect(0, 0, 200, 200, paint);
paint.setTextSize(50);
canvas.drawText("HELLO WORLD",0,300,paint);
效果图
注意： colors和pos的个数一定要相等
三、动起来~
效果图
原理：
让渐变的LinearGradient逐渐从屏幕外移动到文字上。
源码如下：
int x;
@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
ValueAnimator animator=ValueAnimator.ofInt(getMeasuredWidth());
animator.setRepeatCount(ValueAnimator.INFINITE);
animator.setDuration(3000);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
x = (int) animation.getAnimatedValue();
postInvalidate();
}
});
animator.start();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
setLayerType(LAYER_TYPE_SOFTWARE, null);//对单独的View在运行时阶段禁用硬件加速
canvas.drawColor(Color.BLACK);
Matrix matrix = new Matrix();
matrix.setTranslate(x, 0);
LinearGradient linearGradient = new LinearGradient(-getMeasuredWidth(), 300, 0, 0 ,0xffff0000,0xff0000ff, Shader.TileMode.REPEAT);
linearGradient.setLocalMatrix(matrix);
paint.setShader(linearGradient);
paint.setTextSize(50);
canvas.drawText("HELLO WORLD", 0, 300, paint);
}
四、SweepGradient：扫描式渐变
SweepGradient(float cx, float cy, int color0, int color1)
SweepGradient(float cx, float cy, int[] colors, float[] positions)
- (cx,cy) 扫描中心的坐标
- color0:起始颜色，颜色值必须使用0xAARRGGBB形式的16进制表示！表示透明度的AA一定不能少
- color1:终止颜色
举个栗子
SweepGradient sweepGradient = new SweepGradient(100, 100, 0x00FF0000, 0xFF0000FF);
paint.setShader(sweepGradient);
canvas.drawCircle(100, 100, 50, paint);
效果图
详细的就不讲解啦，自己试一下吧
