ngngngn
ngngngn

Reputation: 579

Crop SKTexture with SKLabel text

To create a button in SpriteKit, I created a rounded rectangle with a SKShapeNode and then placed a SKLabel on top of it.

It looks like this: enter image description here

I want to have the background that is under the label change with whatever is under it. So inside the picture the T, E and half the A would be purple.

Is there some way to halfway color the font? Or somehow crop the white rectangle texture with the SKLabel that is placed on it. This way there is no label but instead a cut out of a label from the texture. Basically, I want the font color to be whatever is behind it.

I have to do this without importing images and through code somehow.

Upvotes: 4

Views: 453

Answers (1)

Alessandro Ornano
Alessandro Ornano

Reputation: 35392

Knight0fDragon have reason in his comment, this is a good suggestion. There is another solution you can do without textureFromNode. You can prepare your cropNode with the background and the label, then make another background clone with the button and your cropNode over all:

import SpriteKit
class GameScene: SKScene {
    override func didMove(to view: SKView) {
        let background = SKSpriteNode.init(imageNamed: "background.png")
        background.zPosition = 1
        let background2 = background.copy() as! SKSpriteNode
        //label
        let titleLabel = SKLabelNode(fontNamed: "AvenirNext-Bold")
        titleLabel.fontSize = 150
        titleLabel.fontColor = SKColor.black
        titleLabel.text = "RATE"
        titleLabel.horizontalAlignmentMode = .center
        titleLabel.zPosition = 5
        titleLabel.blendMode = .subtract
        //cropNode
        let cropNode = SKCropNode()
        cropNode.addChild(background)
        cropNode.maskNode = titleLabel
        self.addChild(cropNode)
        cropNode.zPosition = 5
        //button
        let button = SKShapeNode(rect: CGRect(x: -300, y: -50, width: 600, height: 200), cornerRadius: 100)
        button.zPosition = 4
        button.fillColor = SKColor.white
        self.addChild(background2)
        self.addChild(button)
    }
}

Image used: enter image description here

Output:

enter image description here

Another background to test:

enter image description here

Output 2:

enter image description here

Upvotes: 4

Related Questions