How can I properly make a SKLabelNode follow a body with Physics? - xcode

Question

I created class whose behavior is really simple: every object of this class will be a square with a name on top and they will float randomly around the screen.
class XSquare: SKNode {
private var squareShape: SKSpriteNode
private var text: SKLabelNode
init() {
// Sets up the square
squareShape = SKSpriteNode(color: .red, size: CGSize(width: 100, height: 100))
// Sets up the text
text = SKLabelNode(text: "Here goes the name")
text.position = CGPoint(x: 0, y: 100)
// Calls the super initializator
super.init()
// Sets up the square
squareShape.physicsBody = SKPhysicsBody(rectangleOf: squareShape.size)
squareShape.physicsBody?.categoryBitMask = squareBitMask
squareShape.physicsBody?.collisionBitMask = wallBitMask
squareShape.physicsBody?.velocity = CGVector(dx: 10, dy: 10)
squareShape.physicsBody?.angularVelocity = CGFloat(5)
squareShape.physicsBody?.allowsRotation = true
squareShape.physicsBody?.pinned = false
squareShape.physicsBody?.affectedByGravity = false
addChild(squareShape)
addChild(text)
}
}
The reason why I used a SKNode for this class is because I wanted to provide a little text right on the top of every square (a name indicator).
Everything looks fine but when I run the code the name stays fixed while the squares move randomly around the screen (probably because I'm not moving the square with SKAction but with PhysicsBody). By the other hand, If I use squareShape.addChild(text) the text will also rotate following the physics of the square.
I'm a newbie using SpriteKit and I'm sure I'm missing something. Can anyone help me understand?

Answer 1

Just have your text node do the opposite angle. If your shape rotates 10 degrees left, you rotate text 10 degrees right.
Now keep in mind it assumes both anchor points are anchored in the center. You may want to consider a second SKNode that you place between your shape and your text if you want to have the text somewhere else. Then you would reverse rotate the new node instead of the text.
Here is an example on how to do that.
class XSquare: SKNode {
private var squareShape: SKSpriteNode
private var text: SKLabelNode
init() {
// Sets up the square
squareShape = SKSpriteNode(color: .red, size: CGSize(width: 100, height: 100))
// Sets up the text
text = SKLabelNode(text: "Here goes the name")
text.position = CGPoint(x: 0, y: 100)
// Calls the super initializator
super.init()
// Sets up the square
squareShape.physicsBody = SKPhysicsBody(rectangleOf: squareShape.size)
squareShape.physicsBody?.categoryBitMask = squareBitMask
squareShape.physicsBody?.collisionBitMask = wallBitMask
squareShape.physicsBody?.velocity = CGVector(dx: 10, dy: 10)
squareShape.physicsBody?.angularVelocity = CGFloat(5)
squareShape.physicsBody?.allowsRotation = true
squareShape.physicsBody?.pinned = false
squareShape.physicsBody?.affectedByGravity = false
addChild(squareShape)
squareShape.addChild(text)
}
}
func didFinishUpdate(){
text.zRotation = -squareShape.zRotation
}