Android 绘图学习

SweepGradient扫描渐变

SweepGradient可以实现扫描渐变渲染，类似雷达扫描图，渐变圆弧，渐变进度条等，构造函数有两个：

/** * A Shader that draws a sweep gradient around a center point. * * @param cx       The x-coordinate of the center * @param cy       The y-coordinate of the center * @param colors   The colors to be distributed between around the center. *                 There must be at least 2 colors in the array. * @param positions May be NULL. The relative position of *                 each corresponding color in the colors array, beginning *                 with 0 and ending with 1.0. If the values are not *                 monotonic, the drawing may produce unexpected results. *                 If positions is NULL, then the colors are automatically *                 spaced evenly. */public SweepGradient(float cx, float cy,        @NonNull @ColorInt int colors[], @Nullable float positions[])；/** * A Shader that draws a sweep gradient around a center point. * * @param cx       The x-coordinate of the center * @param cy       The y-coordinate of the center * @param color0   The color to use at the start of the sweep * @param color1   The color to use at the end of the sweep */public SweepGradient(float cx, float cy, @ColorInt int color0, @ColorInt int color1) ；

参数说明：
cx,cy 渐变中心坐标。
color0,color1：渐变开始结束颜色。
colors，positions：类似LinearGradient,用于多颜色渐变,positions为null时，根据颜色线性渐变。

两种颜色渐变

构造函数：
SweepGradient(float cx, float cy, @ColorInt int color0, @ColorInt int color1)

sweepGradient = new SweepGradient(450,450,Color.RED, Color.GREEN);mPaint.setShader(sweepGradient);canvas.drawCircle(450,450,450,mPaint);

多颜色扫描渐变

构造函数：
SweepGradient(float cx, float cy,@NonNull @ColorInt int colors[], @Nullable float positions[])

int [] colors = {Color.BLACK,Color.RED, Color.BLUE,Color.GREEN};sweepGradient = new SweepGradient(450,450,colors,null);mPaint.setShader(sweepGradient);canvas.drawCircle(450,450,450,mPaint);

设置position：

position数组设置主要作用是特定位置对应颜色数组，位置取值【0-1】，0表示开始位置，1表示结束位置，数组和颜色数组一一对应。

int [] colors = {Color.BLACK,Color.RED, Color.BLUE,Color.GREEN};float[] postions = {0f,0.1f,0.7f,1.0f};sweepGradient = new SweepGradient(450,450,colors,postions);mPaint.setShader(sweepGradient);canvas.drawCircle(450,450,450,mPaint);

可以明显看到BLUE蓝色变多。

旋转扫描实例：

此处只是示例代码，如果要真实现可以利用属性动画或者handler更新，

@Overrideprotected void onDraw(Canvas canvas) {    super.onDraw(canvas);    startAngle = startAngle +1;    if (startAngle == 360){        startAngle = 0;    }        int [] colors = {Color.parseColor("#2300FF00"),Color.parseColor("#7F00FF00")};    float[] position = new float[2];    position[0] = (startAngle * 1f)/360f;    position[1] = ((startAngle + 60)* 1.0f)/360f;    sweepGradient = new SweepGradient(450,450,colors,position);    mPaint.setShader(sweepGradient);    canvas.drawCircle(450,450,450,mPaint2);    canvas.drawCircle(450,450,350,mPaint2);    canvas.drawCircle(450,450,200,mPaint2);    canvas.drawCircle(450,450,100,mPaint2);    float[] lines = {0, 450, 450, 450, 450,450,900, 450, 450, 0, 450, 450,450,450, 450, 900};    canvas.drawLines(lines,mPaint2);    canvas.drawArc(0,0,900,900,startAngle,endAngle,true,mPaint);    invalidate();}

绘制渐变圆弧

此处只是示例代码，如果要真实现可以利用属性动画或者handler更新，

endAngle = endAngle +1;if (endAngle >= 360){    endAngle = 0;}int [] colors = {Color.parseColor("#FFFFFF00"),Color.parseColor("#FFFF0000")};float[] position = new float[2];position[0] = 0f;position[1] = ((endAngle)* 1.0f)/360f;sweepGradient = new SweepGradient(470,470,colors,position);mPaint.setShader(sweepGradient);canvas.drawCircle(470,470,450,mPaint2);canvas.drawArc(20,20,920,920,startAngle,endAngle,false,mPaint);invalidate();

可以看到，由于设置了positions数组，绘制多少圆弧，颜色是从圆弧开始绘制的地方渐变到圆弧结束弧度。
positions数组的设置也有讲究，需要开始绘制的颜色对应positions数组值为0f，结束位置为((endAngle)* 1.0f)/360f;

如果不设置positions数组参数，结果如下：

 endAngle = endAngle +1;        if (endAngle >= 360){            endAngle = 0;        }        int [] colors = {Color.parseColor("#FFFFFF00"),Color.parseColor("#FFFF0000")};        float[] position = new float[2];        position[0] = 0f;        position[1] = ((endAngle)* 1.0f)/360f;        sweepGradient = new SweepGradient(470,470,colors,null);        mPaint.setShader(sweepGradient);        canvas.drawCircle(470,470,450,mPaint2);        canvas.drawArc(20,20,920,920,startAngle,endAngle,false,mPaint);        invalidate();

可以看到圆弧的渐变颜色一直是从开始到整个圆结束，所以和不设置positions数组有较大区别。

android绘图之Paint(1)
android绘图之Canvas基础（2）
Android绘图之Path（3）
Android绘图之drawText绘制文本相关（4）
Android绘图之Canvas概念理解（5）
Android绘图之Canvas变换（6）
Android绘图之Canvas状态保存和恢复（7）
Android绘图之PathEffect （8）
Android绘图之LinearGradient线性渐变（9）
Android绘图之SweepGradient（10）
Android绘图之RadialGradient 放射渐变（11）
Android绘制之BitmapShader（12）
Android绘图之ComposeShader，PorterDuff.mode及Xfermode（13）
Android绘图之drawText,getTextBounds,measureText,FontMetrics,基线（14）
Android绘图之贝塞尔曲线简介（15）
Android绘图之PathMeasure（16）
Android 动态修改渐变 GradientDrawable

Android绘图之SweepGradient（10）