Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to draw a concentric circle in iphone?

I want to draw a ring. Ring should filled in a outer circle. I referred a documentation http://developer.apple.com/library/mac/#documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/dq_paths/dq_paths.html#//apple_ref/doc/uid/TP30001066-CH211-TPXREF101. But still had problem to get the outcome. Here is the code.

CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextClearRect(ctx, rect);
CGContextSetRGBFillColor(ctx, 0.0, 255.0, 1.0, 1.0);CGContextFillPath(ctx);
CGContextStrokeEllipseInRect(ctx, CGRectMake(125, 125, 150, 150));
CGContextBeginPath(ctx);
CGContextEOFillPath(ctx);
CGContextFillEllipseInRect(ctx, CGRectMake(100, 100, 200, 200));
like image 362
Ka-rocks Avatar asked May 19 '11 15:05

Ka-rocks


People also ask

How do you draw a circle in Apple?

To draw a perfectly symmetrical circle, press and hold the Shift key while you drag. To draw the ellipse from its center, press and hold the Option key while you drag. After you create the shape, press Esc to activate the Select/Transform tool.

How do you make concentric circles in procreate?

Start with a blank canvas. Turn on Drawing guide, edit drawing guide, select symmetry and under symmetry options, select rotational. Using these settings and some careful strokes, you can draw a perfect circle. Duplicate that layer and make a mark between the circle and the edge of the canvas.


1 Answers

You need something more like this:

- (void)drawRect:(CGRect)rect
{
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGContextAddEllipseInRect(ctx, rect);
    CGContextAddEllipseInRect(ctx, 
                CGRectMake(
                    rect.origin.x + 10, 
                    rect.origin.y + 10, 
                    rect.size.width - 20, 
                    rect.size.height - 20));
    CGContextSetFillColor(ctx, CGColorGetComponents([[UIColor blueColor] CGColor]));
    CGContextEOFillPath(ctx);
}

This will add two ellipses to your current path (one being smaller than the other, but centered around the same point). EOFillPath will essentially "subtract" the inner ellipse from the outer ellipse when it fills the path.

To create "concentric" circles, if that's really what you wanted, you can simply repeat this for more - continually smaller - ellipses.

like image 61
Steve Avatar answered Sep 28 '22 21:09

Steve