Draw a hollow circle on an Android Canvas

Question

I am working on creating a custom view where a user can select an angle. Below is an example of what the end result should look like:

enter image description here

I am achieving this with the following code:

mPaint.setColor(Color.BLACK);
canvas.drawCircle((int) (mSize.right / 2), (int) (mSize.bottom / 2),
        mWidthOutside, mPaint);

mPaint.setColor(Color.LTGRAY);
canvas.drawCircle((int) (mSize.right / 2), (int) (mSize.bottom / 2),
        mWidthInside, mPaint);

The problem with doing it this way, is the background is a static LTGRAY, which I hope to make Transparent.

How would I go about leaving the center of the circle transparent?

I have tried the following hoping the the drawArc function would only create a line the width of the paint, and not fill the center. It does in face fill the center.

RectF rectF = new RectF(centerX - mRadius, centerY - mRadius, centerX
            + mRadius, centerY + mRadius);
canvas.drawArc(rectF, 0, 360, false, mPaint);

Suggestions on how to keep the center of the circle transparent?

I have achieved this using 2 images, will do the trick... If you think this can help you just let me know and I will post how to do it... — GhostDerfel, Jan 27 '14 at 17:29
Using two images is less efficient, and will not give me the desired results. — Matt Clark, Jan 27 '14 at 17:32
I'm not here to say what you want to achieve but, the result of my method is exactly what you have drawn and I work with dynamic content on my project, it's a circle calendar picker :) — GhostDerfel, Jan 27 '14 at 17:33
I apologize if the question was misunderstood. The above is a screen capture of what I already have, however, the inside of the circle is determined by the paint being set to `Color.LTGRAY`. I do not want to have to draw a circle on the inside, I just want the outer ring. THe reason is that if their are other objects in the center of the circle, like text, they will be drawn on top of by the circles. Using images is also less efficient because they have to be resized, this just draws free form shapes. — Matt Clark, Jan 27 '14 at 18:07
Does this answer your question? [Android canvas draw rectangle](https://stackoverflow.com/questions/7344497/android-canvas-draw-rectangle) — Vega, Oct 16 '20 at 15:23

score 13 · Accepted Answer · edited Jan 27 '14 at 20:21

13

As asked :) The solution is to set the style to be Paint.Style.STROKE

edited Jan 27 '14 at 20:21

Leigh

28,765
10
55
103

answered Jan 27 '14 at 19:33

GhostDerfel

1,533
1
11
18

Although this answer appears correct, is being identified as low quality. Please make your answer more compile, such as adding an explanation and sample code. – Greg Jan 27 '14 at 20:24

score 2 · Answer 2 · answered Mar 06 '19 at 23:58

Hollow Circle in canvas.

Bitmap bitmap=Bitmap.createBitmap(500,500, Bitmap.Config.ARGB_8888);
    Canvas canvas=new Canvas(bitmap);
    //canvas.clipPath(,Region.Op.DIFFERENCE);
    Paint paint=new Paint();
    paint.setColor(Color.RED);
    paint.setStrokeWidth(140);
    paint.setStyle(Paint.Style.STROKE);
    canvas.drawCircle(250,250,150,paint);
    imageView.setImageBitmap(bitmap);

Draw a hollow circle on an Android Canvas

2 Answers2