How do I create a HUD on top of my Scenekit.scene

Question

I'm experimenting with Swift and Scenekit. Building a Mac OS X app. It seems quite easy to get a 3d-scene working. But what is scene without some kind of 2D hi-score, radar display, speed indicator, etc? I would expect a SpriteKit-scene to seamlessly integrate into a SceneView but I don't find the documentation very clear about this..

The most obvious and only way I can think of is to position a SKView over a SceneView and render each separately. But is there a more elegant way?

Look at the sample code form WWDC 14. It displays a HUD using Sprite Kit on top of Scene Kit. — David Rönnqvist, Jun 25 '14 at 22:35

score 11 · Answer 1 · edited Dec 21 '20 at 03:03

11

try

scnView.overlaySKScene = aSKScene;

(see SCNSceneRenderer.h) This is the recommended way. An alternative way is to make the SCNView layer backed and add child views or layers (but this is less efficient).

edited Dec 21 '20 at 03:03

Tamás Sengel

55,884
29
169
223

answered Jun 25 '14 at 23:08

Toyos

4,024
15
16

1

+1 :) You can find more info in [the docs](https://developer.apple.com/library/prerelease/ios/documentation/SceneKit/Reference/SCNSceneRenderer_Protocol/index.html#//apple_ref/occ/intfp/SCNSceneRenderer/overlaySKScene) and in the [Bananas](https://developer.apple.com/library/prerelease/ios/samplecode/Bananas/Introduction/Intro.html) and [Vehicle](https://developer.apple.com/library/prerelease/ios/samplecode/SceneKitVehicle/Introduction/Intro.html) sample code projects. Another benefit of SK overlays is you can make your HUD cross platform, instead of using UIKit on iOS and AppKit on OS X. – rickster Jun 26 '14 at 16:31
I checked out the Bananas sample project. It fails to run. Can you run the code on 10.9.3? Does swift have an 'overlaySKScene' equivalent? – Ghis Jun 30 '14 at 09:55
1

SceneKit/SpriteKit integration is a 10.10 feature, as are some of the other features you see in Bananas. That project does have an iOS target, though, so you can also try running it on an iOS 8 beta device. – rickster Jul 15 '14 at 04:59

score 7 · Answer 2 · answered Feb 03 '16 at 20:03

To create a HUD, do something like the following:

// SKContainerOverlay is a class which inherits from SKScene

    SKContainerOverlay *skContainerOverlay = [[SKContainerOverlay alloc] initWithSize:self.sceneView.bounds.size];
    self.sceneView.overlaySKScene = skContainerOverlay;
    self.sceneView.overlaySKScene.hidden = NO;
    self.sceneView.overlaySKScene.scaleMode = SKSceneScaleModeResizeFill; // Make sure SKScene bounds are the same as our SCNScene
    self.sceneView.overlaySKScene.userInteractionEnabled = YES;

You can create all your SKLabelNode objects inside the custom SKContainerOverlay class.

Thank you for providing a real answer instead of pointing to the documentation or sample apps. — Brainware, Jun 29 '16 at 22:48

score 2 · Answer 3 · answered Jul 15 '14 at 01:16

As @Toyos said above, you can use

scnView.overlaySKScene = aSKScene

to superimpose the SKScene on your SCNView.

However, when I tried this in Swift, I found that the overlaySKScene property only becomes visible if you include an import SpriteKit statement.

score 0 · Answer 4 · edited Jun 26 '14 at 16:31

0

As @Toyos answered, it is simple to day using scnView.overlaySKScene. If you want an example you can check how Apple did it in their Bananas demo.

edited Jun 26 '14 at 16:31

rickster

124,678
26
272
326

answered Jun 26 '14 at 14:32

Pierre

417
3
11

How do I create a HUD on top of my Scenekit.scene

4 Answers4

Linked