Search code examples
sprite-kitswift3addsubviewbrightness

How to create a subview inside an SKScene?


Before "Buy Ship" is pressed So I am trying to create a shop where players can buy new ships. When the player hits the "buy button" image I want a combination of images and texts to become visible which acts as a sort of conformation screen. Hopefully you can see here what I mean. I would also greatly appreciate if you could tell me how to dim everything besides the conformation box. After "Buy Ship" is pressed.

This is what my code looks like so far:

 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)
        }




    }

}

}

Solution

  • I have figured out how to get the conformation screen to work. Thanks to @AlessandroOrnano for all the help! I have attached my code below for future reference. If anyone has a more efficient way of doing this I would greatly appreciate any suggestions.

    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)
               }
    
        }
    
    }
    
    }
    

    This is the code for 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)
            }
    
    
    
        }
    }
    }
    

    For additional shop pages just copy and paste these sets of codes. With the exception of changing the the tapped nodes around to the correct order in which you wish to move from page to page.