Search code examples
iosdrawrectuibezierpath

UIBezierPath draw circle with different strokes


Basically I need to have a circle with stroke in different color, all equal in size. For example, 1/2 is blue and 1/2 is red. Image (sorry for so bad image):

Example

How can I draw something like this?


Solution

  • There are lots of ways to do it, but one is to just draw two bezier paths, one for each side:

    - (void)drawRect:(CGRect)rect
    {
        UIBezierPath *blueHalf = [UIBezierPath bezierPath];
        [blueHalf addArcWithCenter:CGPointMake(100, 100) radius:90.0 startAngle:-M_PI_2 endAngle:M_PI_2 clockwise:YES];
        [blueHalf setLineWidth:4.0];
        [[UIColor blueColor] setStroke];
        [blueHalf stroke];
    
        UIBezierPath *redHalf = [UIBezierPath bezierPath];
        [redHalf addArcWithCenter:CGPointMake(100, 100) radius:90.0 startAngle:M_PI_2 endAngle:-M_PI_2 clockwise:YES];
        [redHalf setLineWidth:4.0];
        [[UIColor redColor] setStroke];
        [redHalf stroke];
    }
    

    Or, if you want to do this in Core Graphics:

    - (void)drawRect:(CGRect)rect
    {
        CGContextRef context = UIGraphicsGetCurrentContext();
    
        CGContextSetLineWidth(context, 4);
    
        CGContextSetStrokeColorWithColor(context, [[UIColor blueColor] CGColor]);
        CGContextAddArc(context, 100, 100, 90, -M_PI_2, M_PI_2, FALSE);
        CGContextStrokePath(context);
    
        CGContextSetStrokeColorWithColor(context, [[UIColor redColor] CGColor]);
        CGContextAddArc(context, 100, 100, 90, M_PI_2, -M_PI_2, FALSE);
        CGContextStrokePath(context);
    }