Spritekit line with round corner

Question

I use SKShapeNode to draw some lines from point A to point B. The line is pretty width and i need to round the corners to give make it more nice.

After some search, there is a CGPathCreateWithRoundedRect but i'm not sure it can draw line in diagonal.

I have try to add a circle on the line start and line end but the result is not perfect, specially if i use glowWidth on both the circle and the line.

This is how i draw a line:

SKShapeNode *yourline = [SKShapeNode node];
CGMutablePathRef pathToDraw = CGPathCreateMutable();
CGPathMoveToPoint(pathToDraw, NULL, from.x, from.y);
CGPathAddLineToPoint(pathToDraw, NULL, to.x, to.y);
yourline.path = pathToDraw;
[yourline setStrokeColor:[UIColor redColor]];
[nodeGridLines addChild:yourline];

I'm new to spritekit and maybe there is other way to do what i want. And if i could use some texture on my line, it would be great.

Dmitry Klochkov Dmitry Klochkov · Accepted Answer · 2015-02-19T18:23:11

You can use lineCap property of the SKShapeNode.

    UIBezierPath *linePath = [UIBezierPath bezierPath];
    [linePath moveToPoint:CGPointMake(500, 300)];
    [linePath addLineToPoint:CGPointMake(550, 350)];
    SKShapeNode *lineNode = [SKShapeNode shapeNodeWithPath:linePath.CGPath];
    lineNode.lineCap = kCGLineCapRound;
    lineNode.lineWidth = 10;
    [self addChild:lineNode];

Result:

enter image description here

Spritekit line with round corner

2 Answers