Custom Button frame doesn't look as good as Round Rect UIButton

Question

I'm trying to draw a custom button frame as follows:

UIBezierPath *stroke = [UIBezierPath bezierPathWithRoundedRect:self.bounds
                                                  cornerRadius:RECT_CORNECR_RADIUS];

[stroke stroke];

But for some reason the corner curves look thinker than the sides. If you look at the UIButton's default frame it's very uniform. A is a UIButton, B is a custom button.

Any ideas how I can make it more like the UIButton.

Answer 1

You are stroking the bounds of your button. This will draw your line centred over the edge the view, so half of the thickness of the line is outside the bounds and is not drawn. This is why it is full thickness in the corners. Use CGRectInset on your bounds rectangle (inset by half the thickness of your line) and stroke THAT rect.

Answer 2

The problem you have is probably due to antialiasing. You can try to change the antialiasing settings of CoreGraphics before drawing your beizerPath.

An easier solution is to use the CALayer of your button and its cornerRadius property. It would be easier to draw a rounded corner

If self is your custom button:

self.layer.cornerRadius = RECT_CORNER_RADIUS;
self.layer.borderWidth = 1.0f;
self.layer.borderColor = [UIColor blackColor].CGColor;

Of course don't forget to import the QuartzCore framework and import its header for this to work (#import )