Question

I am trying to implement a custom UIView which is basically a pie menu (something like a cake divided into slices).

For that I am trying to draw a circle and a series of lines from the center, like the rays in a chart’s wheel.

I have successfully drawn the circle and and I would now like to draw the lines dividing the circle in slices.

This is what I have so far:

-(void)drawRect:(CGRect)rect{

     [[UIColor blackColor] setStroke];
     CGContextRef ctx = UIGraphicsGetCurrentContext();

    CGFloat minDim = (rect.size.width < rect.size.height) ? rect.size.width : rect.size.height;

    CGRect circleRect =  CGRectMake(0, rect.size.height/2-minDim/2, minDim, minDim); 

    CGContextAddEllipseInRect(ctx, circleRect);
    CGContextSetFillColor(ctx, CGColorGetComponents([[UIColor yellowColor] CGColor]));
    CGContextFillPath(ctx);

    CGPoint start = CGPointMake(0, rect.size.height/2);
    CGPoint end = CGPointMake(rect.size.width, rect.size.height/2);

    for (int i = 0; i < MaxSlices(6); i++){

        CGFloat degrees = 1.0*i*(180/MaxSlices(6));
        CGAffineTransform rot = CGAffineTransformMakeRotation(degreesToRadians(degrees));

        UIBezierPath *path = [self pathFrom:start to:end];
        [path applyTransform:rot];

    }
 }   

- (UIBezierPath *) pathFrom:(CGPoint) start to:(CGPoint) end{

    UIBezierPath*    aPath = [UIBezierPath bezierPath];
    aPath.lineWidth = 5;
    [aPath moveToPoint:start];
    [aPath addLineToPoint:end];
    [aPath closePath];
    [aPath stroke];
    return aPath;
}

The problem is that applyTransform on the path doesn’t seem to do anything. The first path gest drawn correctly the and the following ones are unaffected by the rotation. Basically what I see is just one path. Check the screen shot here http://img837.imageshack.us/img837/9757/iossimulatorscreenshotf.png

Thank you for your help!

Answer 1

You’re drawing the path (with stroke) before you transform it. A path is just a mathematical representation. It isn’t the line “on the screen.” You can’t move what you’ve already drawn by modifying the data about it.

Just move the [aPath stroke] out of pathFrom:to: and put it after the applyTransform:.