安卓如何填充部分圆弧

7

如何使用paint和canvas方法填充下面显示的两个弧之间的绿色区域?

以下是我如何绘制这两个弧的方法,我也可以想出如何用线连接它们,但我不知道如何填充内部区域。

    // set to stroke black
    paint.setColor(Color.BLACK);
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeWidth((float) STROKE_WIDTH);

    // outside arc
    RectF arc_oval_outside = new RectF((float) (getX()), (float) (getY()),
            (float) (getX() + getWidth()), (float) (getY() + getHeight()));
    canvas.drawArc(arc_oval_outside, (float) (0.0), (45.0) (ARC_SWEEP), false, paint);

    // inside arc
    RectF arc_oval_inside = new RectF((float) (getX() + ARC_WIDTH), (float) (getY() + ARC_WIDTH),
            (float) (getX() + getWidth() - ARC_WIDTH), (float) (getY() + getHeight() - ARC_WIDTH));
    canvas.drawArc(arc_oval_inside, (float) (0.0), (float) (ARC_SWEEP), false, paint);
3个回答

9
这里有一种简单的方法来绘制带边框的填充弧形:
Point center = new Point(canvas.getWidth()/2, canvas.getHeight()/2);
int inner_radius = 100;
int outer_radius = 150;
int arc_sweep = 90;
int arc_ofset = 30;

RectF outer_rect = new RectF(center.x-outer_radius, center.y-outer_radius, center.x+outer_radius, center.y+outer_radius);
RectF inner_rect = new RectF(center.x-inner_radius, center.y-inner_radius, center.x+inner_radius, center.y+inner_radius);

Path path = new Path();
path.arcTo(outer_rect, arc_ofset, arc_sweep);
path.arcTo(inner_rect, arc_ofset + arc_sweep, -arc_sweep);
path.close();

Paint fill = new Paint();
fill.setColor(Color.GREEN);
canvas.drawPath(path, fill);

Paint border = new Paint();
border.setStyle(Paint.Style.STROKE);
border.setStrokeWidth(2);
canvas.drawPath(path, border);

图示结果

(这里的PathPaint的分配是为了清晰而不是最优的)


1
我知道可能有点晚了,但我从一个iOS项目中采用了这种方法,首先绘制轮廓,然后绘制填充弧线。 enter image description here
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    float width = (float)getWidth();
    float height = (float)getHeight();
    float radius;

    //Get radius from the bigger size
    if (width > height){
        radius = height/2;
    }else{
        radius = width/2;
    }

    //Create Paint Object
    Paint paint = new Paint();

    paint.setColor(Color.RED);
    paint.setFilterBitmap(true);
    paint.setAntiAlias(true);
    paint.setStrokeWidth(5);
    paint.setStyle(Paint.Style.STROKE);


    //Create Contour Object
    Path path = new Path();

    float center_x, center_y;
    center_x = width/2;
    center_y = height/2;

    //Configure rect for the outer ring
    final RectF oval = new RectF();
    oval.set(center_x - radius + 5,
            center_y - radius + 5,
            center_x + radius - 5,
            center_y + radius - 5);
    //Add outer arc
    path.addArc(oval, 0, 90);

    //Configure rect for the inner ring
    oval.set(center_x - radius + 30,
            center_y - radius + 30,
            center_x + radius - 30,
            center_y + radius - 30);

    //Add inner arc to the path but draw counterclockwise
    path.arcTo(oval, -270, -90);

    //close path
    path.close();

    //Create Paint Object
    Paint fillPaint = new Paint();

    fillPaint.setColor(Color.YELLOW);
    fillPaint.setFilterBitmap(true);
    fillPaint.setAntiAlias(true);
    fillPaint.setStrokeWidth(21);
    fillPaint.setStyle(Paint.Style.STROKE);

    //Create Contour Object
    Path fillPath = new Path();

    //Configure rect for the fill ring
    oval.set(center_x - radius + 17,
            center_y - radius + 17,
            center_x + radius - 17,
            center_y + radius - 17);

    //Add fill arc
    fillPath.addArc(oval, 0, 90);


    //draw fill path
    canvas.drawPath(fillPath,fillPaint);
    //draw outer path
    canvas.drawPath(path, paint);
}

一条有用的链接:http://www.programering.com/a/MDO1czNwATE.html,其中详细解释了 addarc 数学相关内容。

1

这里提供另一种只使用drawArc的选项。基本上,我们首先绘制外部填充弧,然后使用PorterDuff.Mode.CLEAR绘制较小的内部弧以擦除并实现上述要求。

Bitmap b = Bitmap.createBitmap(1200, 1200, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(b);
int radius = 40;
float startAngle = 45f;   // your start angle
float sweepAngle = 90f;   // your sweep angle
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setColor(Color.rgb(37, 181, 215));
paint.setStyle(Paint.Style.FILL);
// draw outer arc
RectF oval = new RectF(0, 0, canvas.getWidth(), canvas.getHeight());
canvas.drawArc(oval, startAngle, sweepAngle, true, paint);
// draw inner arc
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
oval = new RectF((canvas.getWidth() / 2) - radius, (canvas.getHeight() / 2) - radius, (canvas.getWidth() / 2) + radius, (canvas.getHeight() / 2) + radius);
canvas.drawArc(oval, startAngle, sweepAngle, true, paint);

ImageView.setImageBitmap(b);

希望它能帮助到某个人。

enter image description here


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接