12

i need to draw the following image enter image description here

The Gray part is what i want to draw over another image what is the Code i need to use using CGContext methods, i tried using the CGContextAddArc but failed because when i fill the stroke the center hollow is also filled with the grey texture.

Any help appreciated.

Info : I have the Complete Blue Image , i need to add the Semi Circle above the blue image

Thanks

RVN
  • 4,157
  • 5
  • 32
  • 35
  • How would you do a work around when trying to create a doughnut shame using cgcontext and then adding this as in to a layer or shapelayer... Sorry for this but i am not getting my head around this at this moment, so at the mo just shooting blank – tosi Dec 20 '11 at 12:58

3 Answers3

25

Have a look at Filling a Path in the Core Graphics documentation. Basically, what you do is add two arcs to your path (the outer and the inner one) and then use Core Graphics fill rules to your advantage. The code would look something like this:

CGMutablePathRef path = CGPathCreateMutable();

// Add the outer arc to the path (as if you wanted to fill the entire circle)
CGPathMoveToPoint(path, ...);
CGPathAddArc(path, ...);
CGPathCloseSubpath(path);

// Add the inner arc to the path (later used to substract the inner area)
CGPathMoveToPoint(path, ...);
CGPathAddArc(path, ...);
CGPathCloseSubpath(path);

// Add the path to the context
CGContextAddPath(context, path);

// Fill the path using the even-odd fill rule
CGContextEOFillPath(context);

CGPathRelease(path);
Ole Begemann
  • 135,006
  • 31
  • 278
  • 256
10

Working further on what Ole Begemann referred in his answer and some modification, I was able to achieve the requirement.

CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetStrokeColorWithColor(context, [UIColor colorWithPatternImage:[UIImage imageNamed:@"background_grey_pattern.png"]].CGColor);
CGMutablePathRef path = CGPathCreateMutable();
CGContextSetLineWidth(context, 40);
CGPathAddArc(path, NULL, aRect.size.width/2, aRect.size.height/2, 45, 0*3.142/180, angle*3.142/180, 0);
CGContextAddPath(context, path);
CGContextStrokePath(context);
CGPathRelease(path);

So instead of 2 arcs I used only one and stroked it with higher width.

halfer
  • 19,824
  • 17
  • 99
  • 186
RVN
  • 4,157
  • 5
  • 32
  • 35
4

This is tangential but kind of relevant. Here's my Swift drawing code for a donut (or hollow circle).

class func drawDonut(donutColor: UIColor, rect: CGRect, innerDonutProportion: CGFloat) {

    //// Variable Declarations
    let innerDonutSide: CGFloat = rect.size.width * innerDonutProportion
    let innerDonutOffset: CGFloat = 0.5 * (rect.size.width - innerDonutSide)
    let innerDonutRect = CGRectMake(innerDonutOffset, innerDonutOffset, innerDonutSide, innerDonutSide)

    //// InnerCircle Drawing
    let innerCirclePath = UIBezierPath(ovalInRect: innerDonutRect)

    //// Outer Circle Drawing
    let outerCirclePath = UIBezierPath(ovalInRect: rect)

    // Clip out the innerCirclePath
    outerCirclePath.appendPath(innerCirclePath)
    outerCirclePath.addClip()
    outerCirclePath.usesEvenOddFillRule = true;

    // and Fill the outerCircle
    donutColor.setFill()
    outerCirclePath.fill()
}
Dan Rosenstark
  • 68,471
  • 58
  • 283
  • 421
  • Nice! But for the general case where rect.origin is not (0,0) you should instead use: let innerDonutRect = CGRectMake(rect.origin.x + innerDonutOffset, rect.origin.y + innerDonutOffset, innerDonutSide, innerDonutSide). Except for that, your code worked perfectly for me. – rene Apr 03 '16 at 18:35