如何在 SKScene 中创建子视图？
Posted
技术标签:
【中文标题】如何在 SKScene 中创建子视图？【英文标题】：How to create a subview inside an SKScene? 【发布时间】：2017-01-23 00:03:33 【问题描述】：Before "Buy Ship" is pressed所以我正在尝试创建一个玩家可以购买新船的商店。当玩家点击“购买按钮”图像时，我希望图像和文本的组合变得可见，这充当了一种构象屏幕。希望你能在这里明白我的意思。如果您能告诉我如何使除构象框以外的所有东西变暗，我也将不胜感激。 After "Buy Ship" is pressed.
这是我的代码到目前为止的样子：
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)
【问题讨论】：
这里有什么问题，有什么问题？顺便说一句，您的术语是错误的。您不会将子视图添加到场景中。您向其中添加节点。在 UIKit 中，您可以将子视图添加到其他视图。 【参考方案1】：正如 Whirlwind 在他的评论中所说，您可以在场景的中心（位置 CGPoint.zero）创建一个 SKNode，准备好所有的东西并将其隐藏，并将 alpha 属性设置为 0 并将其设为 @ 987654324@ 到 -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)
【讨论】：
我想将这四个精灵和标签节点添加到节点我该怎么做？ conformationBackground，conformationScreenTextTop，conformationScreenTextBottom，conformationScreenTextNo 当你说准备好你所有的东西时，更好的问题是我该怎么做。 @Jfost99 我认为：如果您“亲手”编写了所有这些代码，我认为您没有任何问题 let myNode = SKNode() ; addChild(myNode) ; myNode.position = CGPoint.zero ; myNode.zPosition = 1000 // 添加你想要的元素到 myNode.然后，您只添加此答案中解释的内容 好的，所以我像你上面说的那样创建了一个节点。 让 myNode = SKNode() myNode.position = CGPoint.zero myNode.zPosition = 0 self.addChild(myNode) Omano 我还将标签和文本节点添加到此节点。 让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 （宽度：1300，高度：1400）conformationBackground.name = "conformationBackground" myNode.addChild(conformationBackground)【参考方案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)
对于其他商店页面，只需复制并粘贴这些代码集。除了将点击的节点更改为您希望从一个页面移动到另一个页面的正确顺序。
【讨论】：
以上是关于如何在 SKScene 中创建子视图？的主要内容，如果未能解决你的问题，请参考以下文章