如何在 SKScene 中创建子视图

Question

按下"购买船"之前 所以我正在尝试创建一个商店，玩家可以在其中购买新船。当玩家点击"购买按钮"图像时，我希望图像和文本的组合变得可见，这就像一种构象屏幕。希望你能在这里明白我的意思。如果您能告诉我如何调暗除构象盒之外的所有东西，我将不胜感激。按下"购买船"后。

到目前为止，我的代码如下所示：

 import Foundation
 import SpriteKit
 class ShopPage1: SKScene{

override func didMove(to view: SKView) {
    let background = SKSpriteNode(imageNamed: "background")
    background.position = CGPoint(x: self.size.width/2, y: self.size.height/2)
    background.zPosition = 0
    self.addChild(background)
    let balance = SKLabelNode(fontNamed: "The Bold Font")
    balance.text = "$(balanceAmount)"
    balance.fontSize = 100
    balance.fontColor = SKColor.green
    balance.position = CGPoint(x: self.size.width/2, y: self.size.height*0.87)
    balance.zPosition = 1
    self.addChild(balance)
    let backToMainMenuButton = SKSpriteNode(imageNamed: "backButton2")
    backToMainMenuButton.position = CGPoint(x: self.size.width*0.25, y: self.size.height*0.89)
    backToMainMenuButton.zPosition = 1
    backToMainMenuButton.size = CGSize(width: 200, height: 200)
    backToMainMenuButton.name = "backToMainMenuButton"
    self.addChild(backToMainMenuButton)
    let shipNameLabel = SKLabelNode(fontNamed: "The Bold Font")
    shipNameLabel.text = "Stealth"
    shipNameLabel.fontSize = 200
    shipNameLabel.fontColor = SKColor.white
    shipNameLabel.position = CGPoint(x: self.size.width/2, y: self.size.height*0.60)
    shipNameLabel.zPosition = 1
    shipNameLabel.name = "shipNameLabel"
    self.addChild(shipNameLabel)
    let nextShipButton = SKSpriteNode(imageNamed: "nextShipButton1")
    nextShipButton.position = CGPoint(x: self.size.width*0.75, y: self.size.height*0.40)
    nextShipButton.zPosition = 1
    nextShipButton.size = CGSize(width: 300, height: 300)
    nextShipButton.name = "nextShipButton"
    self.addChild(nextShipButton)

    let nextShipClick = SKLabelNode(fontNamed: "The Bold Font")
    nextShipClick.text = "▲"
    nextShipClick.fontSize = 300
    nextShipClick.fontColor = UIColor.clear
    nextShipClick.position = CGPoint(x: self.size.width*0.753, y: self.size.height*0.36)
    nextShipClick.zPosition = 2
    nextShipClick.name = "nextShipClick"
    self.addChild(nextShipClick)

    let shipForSale = SKSpriteNode(imageNamed: "playerShip4")
    shipForSale.position = CGPoint(x: self.size.width/2, y: self.size.height*0.40)
    shipForSale.zPosition = 1
    shipForSale.size = CGSize(width: 150, height: 300)
    self.addChild(shipForSale)
    let shipPodium = SKSpriteNode(imageNamed: "shipPodium")
    shipPodium.position = CGPoint(x: self.size.width*0.527, y: self.size.height*0.31)
    shipPodium.zPosition = 1
    shipPodium.size = CGSize(width: 1200, height: 70)
    self.addChild(shipPodium)
    let shipsCostLabel = SKLabelNode(fontNamed: "The Bold Font")
    shipsCostLabel.text = "$500"
    shipsCostLabel.fontSize = 200
    shipsCostLabel.fontColor = SKColor.white
    shipsCostLabel.position = CGPoint(x: self.size.width/2, y: self.size.height*0.20)
    shipsCostLabel.zPosition = 1
    self.addChild(shipsCostLabel)
    let shipBuyButton = SKSpriteNode(imageNamed: "shipBuyButton")
    shipBuyButton.position = CGPoint(x: self.size.width*0.54, y: self.size.height*0.15)
    shipBuyButton.zPosition = 1
    shipBuyButton.size = CGSize(width: 1500, height: 900)
    shipBuyButton.name = "shipBuyButton"
    self.addChild(shipBuyButton)
    let conformationBackground = SKSpriteNode(imageNamed: "conformationBackground")
    conformationBackground.position = CGPoint(x: self.size.width*0.51, y: self.size.height*0.40)
    conformationBackground.zPosition = 2
    conformationBackground.size = CGSize(width: 1300, height: 1400)
    conformationBackground.name = "conformationBackground"
    self.addChild(conformationBackground)
    let conformationScreenTextTop = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextTop.text = "Are you sure you wish to"
    conformationScreenTextTop.fontSize = 80
    conformationScreenTextTop.fontColor = SKColor.white
    conformationScreenTextTop.position = CGPoint(x: self.size.width/2, y: self.size.height*0.46)
    conformationScreenTextTop.zPosition = 3
    self.addChild(conformationScreenTextTop)
    let conformationScreenTextBottom = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextBottom.text = "pruchase this ship?"
    conformationScreenTextBottom.fontSize = 80
    conformationScreenTextBottom.fontColor = SKColor.white
    conformationScreenTextBottom.position = CGPoint(x: self.size.width/2, y: self.size.height*0.41)
    conformationScreenTextBottom.zPosition = 3
    self.addChild(conformationScreenTextBottom)
    let conformationScreenTextYes = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextYes.text = "Yes"
    conformationScreenTextYes.fontSize = 150
    conformationScreenTextYes.fontColor = SKColor.green
    conformationScreenTextYes.position = CGPoint(x: self.size.width*0.30, y: self.size.height*0.30)
    conformationScreenTextYes.zPosition = 3
    self.addChild(conformationScreenTextYes)
    let conformationScreenTextNo = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextNo.text = "No"
    conformationScreenTextNo.fontSize = 150
    conformationScreenTextNo.fontColor = SKColor.red
    conformationScreenTextNo.position = CGPoint(x: self.size.width*0.70, y: self.size.height*0.30)
    conformationScreenTextNo.zPosition = 3
    self.addChild(conformationScreenTextNo)

}

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    for touch: AnyObject in touches{
        let pointOfTouch = touch.location(in: self)
        let tappedNode = atPoint(pointOfTouch)
        let tappedNodeName = tappedNode.name

        if  tappedNodeName == "nextShipClick"{
            let sceneToMoveTo = ShopPage2(size: self.size)
            sceneToMoveTo.scaleMode = self.scaleMode
            let myTransition = SKTransition.fade(withDuration: 0.5)
            self.view!.presentScene(sceneToMoveTo, transition: myTransition)
        }
        if  tappedNodeName == "backToMainMenuButton"{
            let sceneToMoveTo = MainMenuScene(size: self.size)
            sceneToMoveTo.scaleMode = self.scaleMode
            let myTransition = SKTransition.fade(withDuration: 0.5)
            self.view!.presentScene(sceneToMoveTo, transition: myTransition)
        }


    }
}
}

Answer 1

正如 Whirlwind 在他的评论中所说，您可以在场景的中心创建一个SKNode（位置CGPoint.zero）用你所有的东西准备它，并在alpha属性设置为 0 的情况下隐藏它，并将其zPosition设置为 -1（在场景的所有其他可见节点下）。

因此，当您按下按钮时，您只需将zPosition更改为最大值，将alpha更改为 1。为了使这些动作更逼真，您可以使用一些动画，例如：

extension UIView {
    func fadeIn(_ duration:TimeInterval=1.0) {
        UIView.animate(withDuration: duration, delay: 0.0, options: UIViewAnimationOptions.curveEaseIn, animations: {
            self.alpha = 1.0 // Instead of a specific instance of, say, birdTypeLabel, we simply set [thisInstance] (ie, self)'s alpha
        }, completion: nil)
    }
    func fadeOut(_ duration:TimeInterval=1.0) {
        UIView.animate(withDuration: duration, delay: 0.0, options: UIViewAnimationOptions.curveEaseOut, animations: {
            self.alpha = 0.0
        }, completion: nil)
    }
}

Answer 2

我已经想出了如何让构象屏幕工作。感谢@AlessandroOrnano的所有帮助！我在下面附上了我的代码以供将来参考。如果有人有更有效的方法，我将不胜感激任何建议。

import Foundation
import SpriteKit
class ShopPage1: SKScene{

override func didMove(to view: SKView) {
    let background = SKSpriteNode(imageNamed: "background")
    background.position = CGPoint(x: self.size.width/2, y: self.size.height/2)
    background.zPosition = 0
    self.addChild(background)
    let balance = SKLabelNode(fontNamed: "The Bold Font")
    balance.text = "$(balanceAmount)"
    balance.fontSize = 100
    balance.fontColor = SKColor.green
    balance.position = CGPoint(x: self.size.width/2, y: self.size.height*0.87)
    balance.zPosition = 1
    self.addChild(balance)
    let backToMainMenuButton = SKSpriteNode(imageNamed: "backButton2")
    backToMainMenuButton.position = CGPoint(x: self.size.width*0.25, y: self.size.height*0.89)
    backToMainMenuButton.zPosition = 1
    backToMainMenuButton.size = CGSize(width: 200, height: 200)
    backToMainMenuButton.name = "backToMainMenuButton"
    self.addChild(backToMainMenuButton)
    let shipNameLabel = SKLabelNode(fontNamed: "The Bold Font")
    shipNameLabel.text = "Stealth"
    shipNameLabel.fontSize = 200
    shipNameLabel.fontColor = SKColor.white
    shipNameLabel.position = CGPoint(x: self.size.width/2, y: self.size.height*0.60)
    shipNameLabel.zPosition = 1
    shipNameLabel.name = "shipNameLabel"
    self.addChild(shipNameLabel)
    let nextShipButton = SKSpriteNode(imageNamed: "nextShipButton1")
    nextShipButton.position = CGPoint(x: self.size.width*0.75, y: self.size.height*0.40)
    nextShipButton.zPosition = 1
    nextShipButton.size = CGSize(width: 300, height: 300)
    nextShipButton.name = "nextShipButton"
    self.addChild(nextShipButton)

    let nextShipClick = SKLabelNode(fontNamed: "The Bold Font")
    nextShipClick.text = "▲"
    nextShipClick.fontSize = 300
    nextShipClick.fontColor = UIColor.clear
    nextShipClick.position = CGPoint(x: self.size.width*0.753, y: self.size.height*0.36)
    nextShipClick.zPosition = 2
    nextShipClick.name = "nextShipClick"
    self.addChild(nextShipClick)

    let shipForSale = SKSpriteNode(imageNamed: "playerShip4")
    shipForSale.position = CGPoint(x: self.size.width/2, y: self.size.height*0.40)
    shipForSale.zPosition = 1
    shipForSale.size = CGSize(width: 150, height: 300)
    self.addChild(shipForSale)
    let shipPodium = SKSpriteNode(imageNamed: "shipPodium")
    shipPodium.position = CGPoint(x: self.size.width*0.527, y: self.size.height*0.31)
    shipPodium.zPosition = 1
    shipPodium.size = CGSize(width: 1200, height: 70)
    self.addChild(shipPodium)
    let shipsCostLabel = SKLabelNode(fontNamed: "The Bold Font")
    shipsCostLabel.text = "$500"
    shipsCostLabel.fontSize = 200
    shipsCostLabel.fontColor = SKColor.white
    shipsCostLabel.position = CGPoint(x: self.size.width/2, y: self.size.height*0.20)
    shipsCostLabel.zPosition = 1
    self.addChild(shipsCostLabel)
    let shipBuyButton = SKSpriteNode(imageNamed: "shipBuyButton")
    shipBuyButton.position = CGPoint(x: self.size.width*0.54, y: self.size.height*0.15)
    shipBuyButton.zPosition = 1
    shipBuyButton.size = CGSize(width: 1500, height: 900)
    shipBuyButton.name = "shipBuyButton"
    self.addChild(shipBuyButton)
    let shipBuyButtonClick = SKLabelNode(fontNamed: "The Bold Font")
    shipBuyButtonClick.text = "▅▅"
    shipBuyButtonClick.fontSize = 300
    shipBuyButtonClick.fontColor = UIColor.clear
    shipBuyButtonClick.position = CGPoint(x: self.size.width/2, y: self.size.height*0.05)
    shipBuyButtonClick.zPosition = 2
    shipBuyButtonClick.name = "shipBuyButtonClick"
    self.addChild(shipBuyButtonClick)
}

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    for touch: AnyObject in touches{
        let pointOfTouch = touch.location(in: self)
        let tappedNode = atPoint(pointOfTouch)
        let tappedNodeName = tappedNode.name

        if  tappedNodeName == "nextShipClick"{
            let sceneToMoveTo = ShopPage2(size: self.size)
            sceneToMoveTo.scaleMode = self.scaleMode
            let myTransition = SKTransition.fade(withDuration: 0.5)
            self.view!.presentScene(sceneToMoveTo, transition: myTransition)
        }
        if  tappedNodeName == "backToMainMenuButton"{
            let sceneToMoveTo = MainMenuScene(size: self.size)
            sceneToMoveTo.scaleMode = self.scaleMode
            let myTransition = SKTransition.fade(withDuration: 0.5)
            self.view!.presentScene(sceneToMoveTo, transition: myTransition)
        }
        if  tappedNodeName == "shipBuyButtonClick"{
            let sceneToMoveTo = ShopPage1ConformationScreen(size: self.size)
            sceneToMoveTo.scaleMode = self.scaleMode
            let myTransition = SKTransition.fade(withDuration: 0.5)
            self.view!.presentScene(sceneToMoveTo, transition: myTransition)
           }
    }
}
}

这是 ShopPage1ConformationScreen 的代码：

 import Foundation
 import SpriteKit

 let shipForSale = SKSpriteNode(imageNamed: "playerShip4")
 class ShopPage1ConformationScreen: SKScene{

override func didMove(to view: SKView) {
    let background = SKSpriteNode(imageNamed: "background")
    background.position = CGPoint(x: self.size.width/2, y: self.size.height/2)
    background.zPosition = 0
    self.addChild(background)
    let balance = SKLabelNode(fontNamed: "The Bold Font")
    balance.text = "$(balanceAmount)"
    balance.fontSize = 100
    balance.fontColor = SKColor.green
    balance.position = CGPoint(x: self.size.width/2, y: self.size.height*0.87)
    balance.zPosition = 1
    self.addChild(balance)
    let backToMainMenuButton = SKSpriteNode(imageNamed: "backButton2")
    backToMainMenuButton.position = CGPoint(x: self.size.width*0.25, y: self.size.height*0.89)
    backToMainMenuButton.zPosition = 1
    backToMainMenuButton.size = CGSize(width: 200, height: 200)
    backToMainMenuButton.name = "backToMainMenuButton"
    self.addChild(backToMainMenuButton)
    let shipNameLabel = SKLabelNode(fontNamed: "The Bold Font")
    shipNameLabel.text = "Stealth"
    shipNameLabel.fontSize = 200
    shipNameLabel.fontColor = SKColor.white
    shipNameLabel.position = CGPoint(x: self.size.width/2, y: self.size.height*0.60)
    shipNameLabel.zPosition = 1
    shipNameLabel.name = "shipNameLabel"
    self.addChild(shipNameLabel)
    let nextShipButton = SKSpriteNode(imageNamed: "nextShipButton1")
    nextShipButton.position = CGPoint(x: self.size.width*0.75, y: self.size.height*0.40)
    nextShipButton.zPosition = 1
    nextShipButton.size = CGSize(width: 300, height: 300)
    nextShipButton.name = "nextShipButton"
    self.addChild(nextShipButton)

    let nextShipClick = SKLabelNode(fontNamed: "The Bold Font")
    nextShipClick.text = "▲"
    nextShipClick.fontSize = 300
    nextShipClick.fontColor = UIColor.clear
    nextShipClick.position = CGPoint(x: self.size.width*0.753, y: self.size.height*0.36)
    nextShipClick.zPosition = 2
    nextShipClick.name = "nextShipClick"
    self.addChild(nextShipClick)

    shipForSale.position = CGPoint(x: self.size.width/2, y: self.size.height*0.40)
    shipForSale.zPosition = 1
    shipForSale.size = CGSize(width: 150, height: 300)
    self.addChild(shipForSale)
    let shipPodium = SKSpriteNode(imageNamed: "shipPodium")
    shipPodium.position = CGPoint(x: self.size.width*0.527, y: self.size.height*0.31)
    shipPodium.zPosition = 1
    shipPodium.size = CGSize(width: 1200, height: 70)
    self.addChild(shipPodium)
    let shipsCostLabel = SKLabelNode(fontNamed: "The Bold Font")
    shipsCostLabel.text = "$500"
    shipsCostLabel.fontSize = 200
    shipsCostLabel.fontColor = SKColor.white
    shipsCostLabel.position = CGPoint(x: self.size.width/2, y: self.size.height*0.20)
    shipsCostLabel.zPosition = 1
    self.addChild(shipsCostLabel)
    let shipBuyButton = SKSpriteNode(imageNamed: "shipBuyButton")
    shipBuyButton.position = CGPoint(x: self.size.width*0.54, y: self.size.height*0.15)
    shipBuyButton.zPosition = 1
    shipBuyButton.size = CGSize(width: 1500, height: 900)
    shipBuyButton.name = "shipBuyButton"
    self.addChild(shipBuyButton)
    let conformationBackground = SKSpriteNode(imageNamed: "conformationBackground")
    conformationBackground.position = CGPoint(x: self.size.width*0.51, y: self.size.height*0.40)
    conformationBackground.zPosition = 2
    conformationBackground.size = CGSize(width: 1300, height: 1400)
    conformationBackground.name = "conformationBackground"
    self.addChild(conformationBackground)
    let conformationScreenTextTop = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextTop.text = "Are you sure you wish to"
    conformationScreenTextTop.fontSize = 80
    conformationScreenTextTop.fontColor = SKColor.white
    conformationScreenTextTop.position = CGPoint(x: self.size.width/2, y: self.size.height*0.46)
    conformationScreenTextTop.zPosition = 3
    conformationScreenTextTop.name = "comformationScreenTextTop"
    self.addChild(conformationScreenTextTop)
    let conformationScreenTextBottom = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextBottom.text = "purchase this ship?"
    conformationScreenTextBottom.fontSize = 80
    conformationScreenTextBottom.fontColor = SKColor.white
    conformationScreenTextBottom.position = CGPoint(x: self.size.width/2, y: self.size.height*0.41)
    conformationScreenTextBottom.zPosition = 3
    conformationScreenTextBottom.name = "conformationScreenTextBottom"
    self.addChild(conformationScreenTextBottom)
    let conformationScreenTextYes = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextYes.text = "Yes"
    conformationScreenTextYes.fontSize = 150
    conformationScreenTextYes.fontColor = SKColor.green
    conformationScreenTextYes.position = CGPoint(x: self.size.width*0.30, y: self.size.height*0.30)
    conformationScreenTextYes.zPosition = 3
    conformationScreenTextYes.name = "conformationScreenTextYes"
    self.addChild(conformationScreenTextYes)
    let conformationScreenTextNo = SKLabelNode(fontNamed: "The Bold Font")
    conformationScreenTextNo.text = "No"
    conformationScreenTextNo.fontSize = 150
    conformationScreenTextNo.fontColor = SKColor.red
    conformationScreenTextNo.position = CGPoint(x: self.size.width*0.70, y: self.size.height*0.30)
    conformationScreenTextNo.zPosition = 3
    conformationScreenTextNo.name = "conformationScreenTextNo"
    self.addChild(conformationScreenTextNo)
}

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    for touch: AnyObject in touches{
        let pointOfTouch = touch.location(in: self)
        let tappedNode = atPoint(pointOfTouch)
        let tappedNodeName = tappedNode.name
        if(balanceAmount >= 500){
        if  tappedNodeName == "conformationScreenTextYes"{
            player = shipForSale
            balanceAmount -= 500
            let sceneToMoveTo = ShopPage1(size: self.size)
            sceneToMoveTo.scaleMode = self.scaleMode
            let myTransition = SKTransition.fade(withDuration: 0.5)
            self.view!.presentScene(sceneToMoveTo, transition: myTransition)
        }
        }
        if  tappedNodeName == "conformationScreenTextNo"{
            let sceneToMoveTo = ShopPage1(size: self.size)
            sceneToMoveTo.scaleMode = self.scaleMode
            let myTransition = SKTransition.fade(withDuration: 0.5)
            self.view!.presentScene(sceneToMoveTo, transition: myTransition)
        }

    }
}
}

对于其他商店页面，只需复制并粘贴这些代码集。除了将点击的节点更改为您希望在页面之间移动的正确顺序。