Reputation: 579
To create a button in SpriteKit, I created a rounded rectangle with a SKShapeNode and then placed a SKLabel on top of it.
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
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)
}
}
Output:
Another background to test:
Output 2:
Upvotes: 4