Swift SpriteKit Rotate Node at x-axis

Question

i am following this tutorial (i think it is written in JavaScript): 3D Terrain

Im trying it in Swift with SpriteKit but have a problem with the rotation at the x-axis.

So this is what it looks like in the tutorial:

And this is where i am now:

I have created this grid with following Code:

var shapePoints = [CGPoint]()
for i in 0...zeilen+1{
    for j in 0...spalten{
        shapePoints.append(CGPoint(x: zellenGroesse*j, y: zellenGroesse*i))
        shapePoints.append(CGPoint(x: zellenGroesse*j, y: zellenGroesse*(i+1)))
    }
}
let fertigeShape = SKShapeNode(points: &shapePoints, count: shapePoints.count)
self.addChild(fertigeShape)

Now i would like to rotate it by some degrees, but i can only rotate it at the z-axis, not the x-axis.

Is there a way in SpriteKit to rotate the node at the x-axis, too?

Thanks and best regards

Answer 1

You can since iOS11, with what's called an SKTransformNode. When you want to 3D perspective tilt a node, add it as a child to a SKTransformNode, and then set it's xRotation or yRotation, which is a value in radians.

let t = SKTransformNode()
t.addChild(someNode)
scene.addChild(t)
t.xRotation = CGFloat.pi // tilts someNode by 180 degrees

You can also animate the change, like this.

let degrees: CGFloat = 20
let radians = CGFloat.pi / 180 * degrees
let duration = 2.0
let tilt = SKAction.customAction(withDuration: duration) { (node, elapsed) in
    let percent = elapsed / CGFloat(duration)
    t.xRotation = percent * radians
}
tilt.timingMode = .easeOut
t.run(tilt)