Replace numbers with custom made numbers SpriteKit

Question

Im a bit lost and looking for a way to make my score numbers appear like flappy bird numbers. I have all the images ready for each number but do not know how to do this.

var scoreLabel: SKLabelNode!


 override init(size: CGSize){
    super.init(size: size)

    GameHandler.sharedInstance.score = 0


   scorelabelhud()
}

func scorelabelhud() {
    scoreLabel = SKLabelNode(fontNamed: "bubblefont.ttf")
    scoreLabel.fontSize = 80
    scoreLabel.fontColor = SKColor.blackColor()
    scoreLabel.position = CGPoint(x: self.size.width / 2, y: self.size.height-110)

    scoreLabel.text = "0"
    self.addChild(scoreLabel)
}

![two muppets][1]

Answer 1

First thing, you can't use SKLabelNode here. I mean, you can create your custom font and then use it, but obviously, you only have images for each number. So create your numbers atlas and name your textures like 0@2x.png, 1@2x.png...9@2x.png.

Then create a property called textures to store textures for each number. Next step would be to split a certain number to its digits. Means to split a number 230, into numbers 2,3 and 0. Later on, based on each digit, you create a SKSpriteNode with appropriate value and position it accordingly.

Here is an example which can give you a starting point:

import SpriteKit

class GameScene: SKScene{

    var textures:[SKTexture] = []

    override func didMoveToView(view: SKView) {

        let atlas = SKTextureAtlas(named: "numbers")

        for i in 0...9 {textures.append(atlas.textureNamed("\(i)"))}

        createSprites(fromNumber: 230)

    }

    func createSprites(fromNumber number:Int){

        //Create an array of digits (of type Int)
        //flatMap will return an array containing the non-nil results of mapping
        let digits = String(number).characters.flatMap { Int(String($0)) }

        var i = 0
        for number in digits {

            if let sprite = createSprite(fromNumber: number) {

                //Do your positioning stuff here. I just placed nodes at the center of the screen
                sprite.position = CGPoint(x:frame.midX, y:frame.midY)
                sprite.position.x += CGFloat(i++) * sprite.size.width

                addChild(sprite)
            }
        }
    }

    func createSprite(fromNumber number:Int)->SKSpriteNode? {
        //Check if number is in allowed range ( 0 - 9 )
        guard 0...9 ~= number else { return nil}

        //You can setup your sprite here instead of just returning it

        return SKSpriteNode(texture: textures[number])

    }
}

I assumed that your scene has the same size as your view, so if that is the case, you can just copy/paste this code and run it to see how it works (it will make three separate SKSpriteNodes and number 230 will be formed).