How to transition from a SwiftUI Page to a SpriteKit Scene?

Question

Created Apr ’21

Replies 3

Boosts 0

Views 2k

Participants 3

Hi, I am applying for this year's WWDC 2021 swift student challenge. I am creating a Mac Xcode Playground. I have created a start menu in Swift UI and a game in SpriteKit, I was wondering how I would go about transitioning between them when a button is clicked in the view.

Right now I am using this code to display the SwiftUI view

Code Block swiftPlaygroundPage.current.setLiveView(  ContentView()    .frame(width: 800, height: 750))

I was thinking I could transition like this:

Code Block swift   func goToGameScene() {    let sceneView = SKView(frame: CGRect(x:0 , y:0, width: 800, height: 750))    if let scene = GameScene(fileNamed: "GameScene") {      sceneView.showsNodeCount = true      sceneView.showsFPS = true      scene.scaleMode = .aspectFit      sceneView.presentScene(scene)    }    PlaygroundPage.current.needsIndefiniteExecution = true    PlaygroundSupport.PlaygroundPage.current.liveView = sceneView  }

I am not sure if this is a good approach. And this method does not give space for animated transitions as well. I was wondering if there is a better way to transition between these views, thank you so much in advance!

Boost

Answer 1

S_dnomseD OP

Apr ’21

I think it'll be better if you use UIViewRepresentable and a .fullScreenCover like so:

Code Block Swiftstruct Test: UIViewRepresentable {    func makeUIView(context: Context) -> SKView {        let sceneView = SKView(frame: CGRect(x:0 , y:0, width: 800, height: 750))        your code        return sceneView    }    func updateUIView(_ uiView: SKView, context: Context) {    }}struct SwiftUIView: View {    @State var show = false    var body: some View {        Button(action: {            show.toggle()        }) {            Text("Go to Game Scene")        }.fullScreenCover(isPresented: $show) {            Test()        }    }}

0

Answer 2

DecoderDE OP

Apr ’21

I have created the playground for MacOS, so UIKit is not available. Thus, UIViewRepresentable and Context are not available. Is there a way to do it with just SwiftUI and SpriteKit? I am also getting this error 'fullScreenCover(isPresented:onDismiss:content:)' is unavailable in macOS. Because its a MacOS Playground
Thanks!

0

Answer 3

dudamello OP

Apr ’21

I don't know how you do this for playgrounds, but that's how you integrate spritekit with swiftUI, you use a spriteView:

Code Block swift// A simple game scene with falling boxesclass GameScene: SKScene {    override func didMove(to view: SKView) {        physicsBody = SKPhysicsBody(edgeLoopFrom: frame)    }    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {        guard let touch = touches.first else { return }        let location = touch.location(in: self)        let box = SKSpriteNode(color: SKColor.red, size: CGSize(width: 50, height: 50))        box.position = location        box.physicsBody = SKPhysicsBody(rectangleOf: CGSize(width: 50, height: 50))        addChild(box)    }}// A sample SwiftUI creating a GameScene and sizing it// at 300x400 pointsstruct ContentView: View {    var scene: SKScene {        let scene = GameScene()        scene.size = CGSize(width: 300, height: 400)        scene.scaleMode = .fill        return scene    }    var body: some View {        SpriteView(scene: scene)            .frame(width: 300, height: 400)            .ignoresSafeArea()    }}

Hope it helps :)

0