Sprite Kit - SKShapeNode Path not drawing Quad Curve

31
votes

I have been delving in to Apple's new Sprite Kit, and been using it for a while now. However I ran into an issue when trying to draw a curved path for an SKShapeNode. It just appears to draw a straight line instead.

Here is a very simple example of the issue I am having - experimenting with drawing a CGPath for an SKShapeNode:

    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, NULL, 0, 0);
    CGPathAddQuadCurveToPoint(path, NULL, 50, 100, 100, 0);
    CGPathAddLineToPoint(path, NULL, 50, -100);
    CGPathCloseSubpath(path);

    SKShapeNode *shape = [[SKShapeNode alloc]init];
    shape.path = path;

    [self addChild:shape];

    CGPathRelease(path);

Here is my ASCII art of what it is doing (Sorry I don't have enough reputation to post an actual image yet):

---------------------------------------------------------------------------------
|          EXPECTED RESULT              |            ACTUAL RESULT              |
---------------------------------------------------------------------------------
|                                       |                                       |
|             __----__                  |                                       |
|            /        \  <- Curve       |                ?                      |
|           /          \                |           ____________                |
|           \          /                |           \          /                |
|            \        /                 |            \        /                 |
|             \      /                  |             \      /                  |
|              \    /                   |              \    /                   |
|               \  /                    |               \  /                    |
|                \/                     |                \/                     |
---------------------------------------------------------------------------------

As you can see, it is not drawing the curve that I want from this line of code:

CGPathAddQuadCurveToPoint(path, NULL, 50, 100, 100, 0);

I have tried using CGPathAddArcToPoint(...), which works, and would be a good substitute in this example. However, for my actual needs, I need to be able to draw a quad curve.

The CGPath seems to be drawing everything appropriately apart from CGPathAddQuadCurveToPoint(...) and also, CGPathAddCurveToPoint(...) - where they just draw a straight line between the points instead.

Does anyone have any idea what the issue is? Or is this a bug with Sprite Kit?

1
iossprite-kitcgpathskshapenode
Your code works on my end, displaying the curve as expected. Have you tried compiling this in a new project, in isolation? Maybe it's not working in the broader context of your app due to some side effects? – Batalia
I was just trying that just then, and it turns out that it must be the issue. I recently installed ios 7.1 beta on my iphone, so i have also needed to be compiling in xcode 5.1 beta. It seems like that version of xcode just doesn't like curves. I tried xcode 5.0 through the ios simulator and it seemed to work fine. I'll look into it through the apple dev forums now. Good to know that it isn't my coding ability that caused it :D Thanks for your help. – David Williames
Xcode 5.1 public release (5B130a) has the same issue using the iOS 7.1 Simulator. The iOS 7.0 Simulator works fine. I can't currently test on an iOS 7.1 device to see if it is an issue there or not. – jowie
Same here. XCode Version 5.1 (5B130a), iOS 7.1 (11D167) is not drawing quadric Bezier curves, just cubic ones, neither in the Simulator nor on a device. – alecail
SKShapeNode is buggy in iOS 7. See SKShapeNode, you are dead to me – Jamie McDaniel

1 Answers

2
votes

That "y" should be the height of your curve, try giving it a non zero value. By giving a coordinate it cannot know how steep the curve should be. So that is the height

CGPathAddQuadCurveToPoint(path, NULL, 50, 100, 100, 30);