Question

I am trying to create a pie chart. Each pie should be with different color and have it’s border. So I made my own class PieChart.m:

#import "PieChart.h"


@implementation PieChart
@synthesize startDeg, endDeg, isSelected, colorNumber;

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
    }
    return self;
}


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
    // Drawing code

    int centerX = 120;
    int centerY = 160;
    int radius  = 94;

    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGContextSetRGBStrokeColor(ctx, 255.0/255.0, 255.0/255.0, 255.0/255.0, 1.0);
    CGContextSetLineWidth(ctx, 2.0);

    CGContextSetRGBFillColor(ctx, [self getColorFor:1]/255.0, [self getColorFor:2]/255.0, [self getColorFor:3]/255.0, 1.0);

    CGContextMoveToPoint(ctx, centerX, centerY);
    CGContextAddArc(ctx, centerX, centerY, radius, (startDeg)*M_PI/180.0, (endDeg)*M_PI/180.0, 0); 

    CGContextClosePath(ctx);
    CGContextFillPath(ctx);
}

- (void)dealloc
{
    [super dealloc];
}

-(float)getColorFor:(int)rgb {
    if (colorNumber == 1) {
        switch (rgb) {
            case 1:
                return 232.0;
                break;
            case 2:
                return 96.0;
                break;
            case 3:
                return 104.0;
                break;

            default:
                return 255.0;
                break;
        }
    }
    if (colorNumber == 2) {
        switch (rgb) {
            case 1:
                return 248.0;
                break;
            case 2:
                return 198.0;
                break;
            case 3:
                return 6.0;
                break;

            default:
                return 255.0;
                break;
        }
    }

    return 255.0;
}

@end

The problem is that the borders would never draw. Or if I manage to draw the border the fill wouldn’t be there! Any suggestions how this should be achieved?

Here is how I use the class in my viewcontroller:

- (void)viewDidLoad
{
    [super viewDidLoad];

    PieChart *pie1 = [[PieChart alloc] initWithFrame:CGRectMake(10, 10, 300, 400)];
    pie1.startDeg = 0;
    pie1.endDeg = 127;
    pie1.colorNumber = 1;
    pie1.backgroundColor = [UIColor clearColor];

    PieChart *pie2 = [[PieChart alloc] initWithFrame:CGRectMake(10, 10, 300, 400)];
    pie2.startDeg = 127;
    pie2.endDeg = 360;
    pie2.colorNumber = 2;
    pie2.backgroundColor = [UIColor clearColor];

    [self.view addSubview:pie1];
    [self.view addSubview:pie2];
}

Answer 1

The problem with your code is that you only fill your path, not stroking it – so naturally border is now drawn. You need to replace CGContextFillPath call with

CGContextDrawPath (ctx, kCGPathFillStroke);