SpriteKit static HUD with camera on player

Question

My issue is the HUD isn't staying in the same position but moving with the camera also.

I'm trying to create a version of Sokoban using swift_boxxle code found on Github,

I've added a new SKNode called mazeWorld, a camera node and a HUD node.

var mazeWorld: SKNode?
let cam = SKCameraNode()
var HUD: SKNode?

In my didMoveToView I'm adding both the mazeWorld and the HUD to the scene.

override func didMoveToView(view: SKView) {
    HUD = SKNode()
    addChild(HUD!)

    mazeWorld = SKNode()
    addChild(mazeWorld!)

    self.camera = cam
    ...
    initMenu()
}

I'm using the update function to set the camera position to the player position:

override func update(currentTime: CFTimeInterval) {
    cam.position = player.sprite.position
}

I've got another function to setup the menu

func initMenu() {
    menuReset.text = "[reset]"
    menuReset.fontSize = 20
    menuReset.fontColor = SKColor.whiteColor()
    menuReset.position = CGPoint(x: self.size.width/2, y: self.size.height/2 - 20)
    menuReset.horizontalAlignmentMode = SKLabelHorizontalAlignmentMode.Left;
    ...
    HUD!.addChild(menuMain)
}

Update

I added the following:

    let label = UILabel(frame: CGRectMake(0, 0, 200, 21))
    label.textAlignment = NSTextAlignment.Center
    label.text = "I'am a test label"
    label.textColor = UIColor.whiteColor()
    self.view!.addSubview(label)

With SO Answer

    var frame: CGRect = label.frame
    //align on top right
    let xPosition: CGFloat = CGRectGetWidth(view.frame) - CGRectGetWidth(frame)
    frame.origin = CGPointMake(ceil(xPosition), 0.0)
    label.frame = frame
    //autoresizing so it stays at top right (flexible left and flexible bottom margin)
    view.autoresizingMask = [.FlexibleLeftMargin, .FlexibleBottomMargin]

Possible duplicate of [Swift: Make control buttons not move with camera](http://stackoverflow.com/questions/35351702/swift-make-control-buttons-not-move-with-camera) — rickster, Mar 28 '16 at 19:30
See also [Clamping camera around the background of a scene in SpriteKit](http://stackoverflow.com/a/35189679/957768) — rickster, Mar 28 '16 at 19:31
Thanks, I'll take a look and watch Deeper into GameplayKit with DemoBots (https://developer.apple.com/videos/play/wwdc2015/609/?time=447) — Alex Hedley, Mar 28 '16 at 20:01

score 5 · Answer 1 · answered Oct 07 '16 at 10:25

I am not familiar with Boxxle or how it impact your workflow, but in the context of Sprite Kit: You should add the HUD node as a child node of your SKCamera node. That way, it is not transformed with the rest of the scene's children (i.e., the maze node).

So cam.addChild(HUD!) instead of addChild(HUD!).

score 1 · Answer 2 · answered Mar 27 '16 at 17:37

As a quick alternate, you may also want to consider using a UILabel which will not be affected by the SpriteKit scene.

If you want to stick with SKLabelNodes then in the didSimulatePhysics method, set the HUDs location to the cams position plus whatever offset it had from the start of the game. So something like:

override func didSimulatePhysics () { // I forget if this has a parameter
    HUD.position = cam.position;
}

The reason that we are going with after the physics are done is so it will move the hud after everything else has moved, and incase you use physics that may affect the player's position, everything will be good.

Thanks, I gave the label a go (updated question) I'll see how a view with the info I need works — Alex Hedley, Mar 27 '16 at 17:55

score 0 · Answer 3 · answered Mar 28 '16 at 18:26

0

Your issue is you are moving the camera node on the entire scene, but in reality you want to be adjusting your maze world node only. I am not sure how to do this though, you will need to research this part

answered Mar 28 '16 at 18:26

Knight0fDragon

16,609
2
23
44

CenterOnNode would only help you in the case you do not plan on moving the camera. Your problem is you want to move the scene, but not move the HUD, that cant happen. You can move the scene and move the HUD in the opposite direction (Which is what Gilderman is suggesting by setting the hud position to the cam position), or you can just move the mazeWorld node inside the scene, and not even bother changing the camera – Knight0fDragon Mar 28 '16 at 18:37

SpriteKit static HUD with camera on player

3 Answers3