how to clip a circle created using CGContextFillEllipseInRect with another circle

Question

I am drawing a simple filled circle using following code in draw rect.

CGContextRef con = UIGraphicsGetCurrentContext();
CGContextAddEllipseInRect(con, CGRectMake(0,0,self.bounds.size.width,self.bounds.size.height));
CGContextSetFillColorWithColor(con, [UIColor blueColor].CGColor);
CGContextFillPath(con);

it draws a circle properly. Now I want to clip the circle with another small circle in the middle so that it becomes a hollow circle and you can see whatever is behind the main circle. How can i do that?

Answer 1

I was able to do that using the EO rule.

CGContextRef con = UIGraphicsGetCurrentContext();
CGContextAddEllipseInRect(con, rect);
CGContextAddEllipseInRect(con, CGRectInset(rect, 40, 40));
CGContextSetFillColorWithColor(con, [UIColor blueColor].CGColor);
CGContextEOFillPath(con);

Answer 2

Use the even-odd rule with CGContextEOClip()

CGSize size = rect.size;
CGContextRef context = UIGraphicsGetCurrentContext();

CGContextTranslateCTM(context, 0, 0);
CGContextSaveGState(context);

CGContextAddPath(context, ([UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, size.width, size.height)].CGPath));
CGContextAddPath(context, ([UIBezierPath bezierPathWithOvalInRect:CGRectMake(size.width/4, size.height/4, size.width/2, size.height/2)].CGPath));
CGContextEOClip(context); //clip
CGContextAddPath(context, [UIBezierPath bezierPathWithRect:rect].CGPath);

CGContextSetFillColorWithColor(context, [UIColor greenColor].CGColor);
CGContextFillPath(context);

CGContextRestoreGState(context);