SKShapeNode rotation along its center

Question

I have an SKShapeNode (a rectangle in this case) which I am trying to rotate in its center. However, it rotates along the lower left bottom of the screen. Since I cannot set the anchor point for SKShapeNode, how can I achieve my requirement (to rotate the figure along its center). This is the code I'm trying to do.

let rectangle = SKShapeNode() rectangle.path = UIBezierPath(rect: CGRectMake(view.frame.width/4, view.frame.height/2, view.frame.width/2, view.frame.width/2)).CGPath rectangle.fillColor = UIColor.yellowColor() rectangle.strokeColor = UIColor.yellowColor() let oneRevolution = SKAction.rotateByAngle(360, duration: 100.0) let repeat = SKAction.repeatActionForever(oneRevolution) rectangle.runAction(repeat) 

Answer 1

You looked at the SKShapeNode documentation: https://developer.apple.com/library/IOs/documentation/SpriteKit/Reference/SKShapeNode_Ref/index.html

Try using:

 shapeNodeWithPath:centered: 

Select YES to center.

If YES, the path is translated so that the center of the paths of the bounding box are at the beginning of the node; otherwise, the path is relative to the start of node s.

Answer 2

 SKSpriteNode rectangle = [SKSpriteNode spriteWithSize size: CGSizeMake(20,20)]; 

You can make the same rectangle as spriteNode which gives you access to change the anchorpoint. My syntax may be a bit, but I believe that it can also take color in the constructor.

Answer 3

When creating SKShapeNode, you should set it to the center as follows:

 let shapePath = UIBezierPath(...) ... ... let shape = SKShapeNode(path: shapePath.cgPath, centered: true) 

Thus, the SKShapeNode anchor point will be the center point.

Answer 4

We must explicitly center the SKShapeNode before applying rotation.

  import SpriteKit import PlaygroundSupport let bounds = CGRect(x: 0, y: 0, width: 400, height: 200) let skview = SKView(frame: bounds) PlaygroundPage.current.liveView = skview 

In the first and second examples below, this is done by setting the x and y parameters when initializing the rectangle, and then setting the position property.

  let first = SKShapeNode(rect: CGRect(x:-20, y:-20, width: 40, height: 40)) first.position = CGPoint(x: 70, y: 30) let second = SKShapeNode(rect: CGRect(x:-20, y:-20, width: 40, height: 40)) second.position = CGPoint(x: 70, y: 30) second.zRotation = CGFloat.pi * 0.15 second.strokeColor = .red 

In the third example below, this is done by setting centered to true when the shape is initialized, and then setting the position property.

  let path = CGMutablePath(); path.move(to: CGPoint(x: 50,y: 10)) path.addLine(to: CGPoint(x: 90, y: 10)) path.addLine(to: CGPoint(x: 90, y: 50)) path.addLine(to: CGPoint(x: 50, y: 50)) path.addLine(to: CGPoint(x: 50, y: 10)) let third = SKShapeNode(path: path, centered: true); third.position = CGPoint(x: 70,y: 30); third.zRotation = CGFloat.pi * 0.35 third.strokeColor = .yellow let scene = SKScene(size: CGSize(width: 400, height: 200)) scene.scaleMode = SKSceneScaleMode.aspectFill scene.size = skview.bounds.size scene.addChild(first); scene.addChild(second); scene.addChild(third); skview.presentScene(scene);