6

如何使用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);
4

3 回答 3

8

这是绘制带边框的填充圆弧的简单方法:

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分配明确不是最优的)

于 2015-05-20T20:32:47.560 回答
1

我知道这可能有点晚了,但我从一个 iOS 项目中采用了这种方法,首先绘制轮廓,然后绘制填充在此处输入图像描述

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 数学得到了很好的解释

于 2015-05-20T19:20:37.657 回答
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);

希望它可以帮助某人。

在此处输入图像描述

于 2016-10-27T05:28:48.417 回答