Draw a curved rectangle inside a circle on iOS

I am trying to draw a wheel of variety (a circle with curved rectangles inside):

circle http://api.ning.com/files/oKZwndeqeam7%2aMiO7f4BDUT%2aAgw3WsK3kW-b-wXjR8gCrCqVAv3RpyBAdi%2adYSLaca0kAYCY0Wk13bSHDnEbOVR1Neluywyotwy

I know how to draw a circle, but I don’t know how to draw a curved rectangle based on the coordinates of the circle.

How can i do this?

-1
source share
1 answer

Since you know how to draw circles, just add a few lines to the center and you will get something like the image you placed:

- (void)drawRect:(CGRect)rect
{
    CGPoint centerPoint = self.center;
    CGFloat circleWidth = 30;
    int numCircles = 4;

    [[UIColor colorWithHue:0.53 saturation:1 brightness:0.6 alpha:1] setStroke];

    CGContextRef ctx = UIGraphicsGetCurrentContext();
    for(int i=numCircles-1;i>=0;i--){
        //calculate some color
        CGFloat colorModifier = ((numCircles-i)/(float)numCircles);
        [[UIColor colorWithHue:0.53 saturation:colorModifier*0.8+0.2 brightness:1-colorModifier*0.4 alpha:1] setFill];

        CGFloat radius = circleWidth*(i+1);

        //draw the circle
        CGContextFillEllipseInRect(ctx, CGRectMake(centerPoint.x-radius, centerPoint.y-radius, 2*radius, 2*radius));
        CGContextStrokeEllipseInRect(ctx, CGRectMake(centerPoint.x-radius, centerPoint.y-radius, 2*radius, 2*radius));

        if(i>0){
            //just add a random number of dividers here
            int numDivider = 3+(arc4random()%5);
            float angleStep = 2*M_PI/numDivider;
            for(int j=0;j<numDivider;j++){
                CGFloat x = centerPoint.x + sinf(j*angleStep)*radius;
                CGFloat y = centerPoint.y + cosf(j*angleStep)*radius;
                CGContextMoveToPoint(ctx, centerPoint.x, centerPoint.y);
                CGContextAddLineToPoint(ctx, x, y);
                CGContextStrokePath(ctx);
            }
        }
    }
}

. :

    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:self.center];
    [path addArcWithCenter:self.center radius:150 startAngle:-0.3 endAngle:0.3 clockwise:YES];
    [path fill];

    UIBezierPath *innerPath = [UIBezierPath bezierPath];
    [innerPath moveToPoint:self.center];
    [innerPath addArcWithCenter:self.center radius:120 startAngle:0 endAngle:2*M_PI clockwise:YES];
    CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeClear);
    [innerPath fill];
0

Source: https://habr.com/ru/post/1548447/


All Articles