如何在Android中绘制带分区的圆形？

Question

我想在我的应用程序中绘制这种类型的圆。我能够使用Canvas绘制圆形，但我不知道如何制作分区？

有人能建议我如何制作分区圆吗？

编辑：- 我想画出内圆中的线。

提前致谢。

- anddev

Answer 1

这里是符合您需求的可用代码......

修改代码：

    Paint paint1 = new Paint();
        Paint paint2 = new Paint();
        Paint paint3 = new Paint();
        Paint paint4 = new Paint();
        Paint paint5 = new Paint();
        final RectF rect = new RectF();
        int mRadius = 130;
        //Example values
        rect.set(getWidth()/2- mRadius, getHeight()/2 - mRadius, getWidth()/2 + mRadius, getHeight()/2 + mRadius); 
        paint1.setColor(Color.GREEN);
        paint1.setStrokeWidth(mRadius/2);
        paint1.setAntiAlias(true);
        paint1.setStrokeCap(Paint.Cap.BUTT);
        paint1.setStyle(Paint.Style.STROKE);
        paint2.setColor(Color.RED);
        paint2.setStrokeWidth(mRadius/2);
        paint2.setAntiAlias(true);
        paint2.setStrokeCap(Paint.Cap.BUTT);
        paint2.setStyle(Paint.Style.STROKE);
        paint3.setColor(Color.BLUE);
        paint3.setStrokeWidth(5);
        paint3.setAntiAlias(true);
        paint3.setStrokeCap(Paint.Cap.BUTT);
        paint3.setStyle(Paint.Style.STROKE);
        canvas.drawArc(rect, 0, 60, false, paint1);
        canvas.drawArc(rect, 60, 60, false, paint2);
        canvas.drawArc(rect, 120, 60, false, paint1);
        canvas.drawArc(rect, 180, 60, false, paint2);
        canvas.drawArc(rect, 240, 60, false, paint1);
        canvas.drawArc(rect, 300, 60, false, paint2);

        canvas.drawLine(getWidth()/2, 
                getHeight()/2, getWidth()/2-mRadius/2, getHeight()/2-mRadius/2,paint3);

        canvas.drawLine(getWidth()/2, 
                getHeight()/2, getWidth()/2+mRadius/2, getHeight()/2-mRadius/2,paint3);

        canvas.drawLine(getWidth()/2, 
                getHeight()/2, getWidth()/2-mRadius/2, getHeight()/2+mRadius/2,paint3);

        canvas.drawLine(getWidth()/2, 
                getHeight()/2, getWidth()/2+mRadius/2, getHeight()/2+mRadius/2,paint3);

        canvas.drawLine(getWidth()/2, 
                getHeight()/2, getWidth()/2-mRadius/4-mRadius/2, getHeight()/2,paint3);

        canvas.drawLine(getWidth()/2, 
                getHeight()/2, getWidth()/2+mRadius/4+mRadius/2, getHeight()/2,paint3);

        paint4.setColor(Color.BLACK);

        canvas.drawCircle(getWidth()/2, getHeight()/2, mRadius/2, paint4);

        paint5.setColor(Color.YELLOW);
        paint5.setStrokeWidth(3);
        paint5.setAntiAlias(true);
        paint5.setStrokeCap(Paint.Cap.BUTT);
        paint5.setStyle(Paint.Style.STROKE);
        canvas.drawCircle(getWidth()/2, getHeight()/2, mRadius/2, paint5);

我希望现在您对我的回答感到满意....

- himanshu

---

让我们在聊天中继续这个讨论。 - anddev

你好 Himanshu，早上好。你怎么样？你知道如何使用 Canvas 绘制圆形边框颜色吗？ - anddev

不是早上好，而是下午好。你可以在圆形外面放一个不同颜色的环。尝试使用paint.setStrokeWidth(0或1); 并使用该paint来绘制环。 - himanshu

请问如果我想制作与上面图片相同带黑色边框的效果，应该如何制作呢？谢谢。 - anddev

@himanshu：谢谢你的代码，我觉得很有用。但是我该如何将文本设置在圆形上？ - Najib.Nj

Answer 2

我有一个想法，首先使用分区在圆内绘制。

        can.drawArc(oval, startAngle, sweepAngle, useCenter, paint)

将角度值取为0到60，然后再以同一中心绘制另一个弧，从60到120等等。每次在Paint中设置不同的颜色。完成内部圆后，大部分工作就完成了。现在在第一个圆之上绘制一个半径较小、中心相同的白色圆。这样就会覆盖在第一个圆上。

希望这会对你有所帮助 :)

- Tofeeq Ahmad

---

谢谢 Sameer 快速回复，是的，我明白你的想法，但你能告诉我椭圆参数的值吗？ - anddev

例如：RectF rect=new RectF(100,100,130,140); can.drawArc(rect, 0.0f, 60.0f, true, new Paint()); 如果您从任何答案中获得了任何想法，请通过投票来学会欣赏它。 - Tofeeq Ahmad

如果你还有任何疑问，可以来聊天吗？今天我比较闲。 - Tofeeq Ahmad

是的，使用这个方法我无法得到我想要的完整输出。你能给我更详细的示例代码吗？ - anddev

你能看到Himanshu给我一个链接，根据那个链接，你能得到任何想法吗？ - anddev

希望你能理解，我无法为你编写代码。现在只是关于坐标几何学的问题。你应该根据这个思路自己尝试一下。 - Tofeeq Ahmad

Answer 3

嘿，我找到了我的问题的解决方案。

final RectF rect1 = new RectF();
int mWidth = this.getWidth()/2;
int mHeight = this.getHeight()/2;
int mRadius = 130, mRadius1 = 50;
rect1.set(mWidth -(mRadius-mRadius1), mHeight - (mRadius-mRadius1), mWidth + (mRadius-mRadius1), mHeight + (mRadius-mRadius1));

Paint paintLines = new Paint();
paintLines.setColor(Color.BLACK);
paintLines.setStrokeWidth((mRadius-mRadius1)/2);
paintLines.setAntiAlias(false);
paintLines.setStrokeCap(Paint.Cap.BUTT);
paintLines.setStyle(Paint.Style.STROKE);

canvas.drawArc(rect1, 0, 1, false, paintLines); 
canvas.drawArc(rect1, 30, 1, false, paintLines);
canvas.drawArc(rect1, 60, 1, false, paintLines);
canvas.drawArc(rect1, 90, 1, false, paintLines);
canvas.drawArc(rect1, 120, 1, false, paintLines);
canvas.drawArc(rect1, 150, 1, false, paintLines);

- anddev

---

是的，我看到了，谢谢Himanshu。你知道如何在Canvas中使用缩放功能吗？ - anddev

我向谷歌询问并使用了这段代码http://vivin.net/2011/12/04/implementing-pinch-zoom-and-pandrag-in-an-android-view-on-the-canvas/，缩放功能可以正常工作，但是滚动不正确。我只能在屏幕的一侧进行缩放。 - anddev