CODEWITHSUNDEEP
iosobjective-cuibezierpath
1234
1234

Reputation: 579

ObjectiveC UIBezierPath path close issue

I try to hexagon and I have some issue in the close path.

Here is my hexagon, and the close path is not smooth. enter image description here

Here is my drawing code

    CAShapeLayer* shapeLayer = [CAShapeLayer layer];
    UIBezierPath* path = [UIBezierPath bezierPath];
//  [path setLineJoinStyle:kCGLineJoinRound];
//  [path setLineJoinStyle:kCGLineJoinBevel];
    [path setLineJoinStyle:kCGLineJoinMiter];
//  CGFloat dashes[] = {6, 2};
//  [path setLineDash:dashes count:2 phase:0];
//  [path stroke];

    CGFloat radians = 100.0;
    NSInteger num = 6;
    CGFloat interval = 2*M_PI/num;

    NSInteger initX = radians*cosf(interval);
    NSInteger initY = radians*sinf(interval);

    [path moveToPoint:CGPointMake(location.x - semiWidth + initX, location.y - semiHeight + initY)];
    for(int i=1; i<=num; i++){
        CGFloat x = radians*cosf(i*interval);
        CGFloat y = radians*sinf(i*interval);
        [path addLineToPoint:CGPointMake(location.x - semiWidth + x, location.y - semiHeight + y)];
    }
    [path closePath];
    shapeLayer.path = [path CGPath];
    shapeLayer.strokeColor = [[UIColor yellowColor] CGColor];
    shapeLayer.fillColor = [[UIColor brownColor] CGColor];
    shapeLayer.lineWidth = 4.0f;

Also I try to use different options as following with no luck

[path setLineJoinStyle:kCGLineJoinRound];
[path setLineJoinStyle:kCGLineJoinBevel];
[path setLineJoinStyle:kCGLineJoinMiter];

Upvotes: 2

Views: 270

Answers (1)

matt
matt

Reputation: 536028

The problem is that you're not making your first point (the point you move-to) the same way you're making your other points (the points you line-to).

NSInteger initX = radians*cosf(interval);
NSInteger initY = radians*sinf(interval);
[path moveToPoint:CGPointMake(
    location.x - semiWidth + initX, location.y - semiHeight + initY)];

Instead, make the first point completely parallel with the others:

CGFloat x = radians*cosf(0*interval);
CGFloat y = radians*sinf(0*interval);
[path moveToPoint:CGPointMake(
    location.x - semiWidth + x, location.y - semiHeight + y)];

That's exactly the same as what you'll do later with i*interval, and to emphasize that parallelism, I've written 0 as 0*interval. Here's what I ended up with:

enter image description here

Upvotes: 4

Related Questions