Render SKLabel ontop of SKSprite

Question

I'm trying to create a UI using SpriteKit on top of a MetalView. I'm using SKRenderer to render a SKScene. With the orientation I'm using, I would expect the SKLabel to use the SKSprite's background. Instead, it's rendering transparently and showing the MetalView.

I've also played with the zPosition attribute.

    cLabel = SKLabelNode(fontNamed: "ArialMT")
    cLabel.text = "Test Text"
    cLabel.fontSize = 65
    cLabel.fontColor = SKColor.white
    cLabel.position = CGPoint(x: 1125 / 2, y: (2436-2436 / 10))
    scene.addChild(cLabel)
    
    let sprite = SKSpriteNode(imageNamed: "banner.png")
    sprite.position = CGPoint(x: 1125 / 2, y: (2436-2436 / 12))
    sprite.name = "sprite"
    scene.addChild(sprite)
    
    //scene.addChild(sprite)
    //sprite.addChild(cLabel)

@ElTomato I updated the main post to contain this info. I'm using the SKRenderer to render a SKScene. My understanding is the label needs to be attached to the scene to be rendered. Is that incorrect? — Bill Tudor, Jun 30 '21 at 16:13
I don't know anything about `SKRenderer`. So I can't answer your question. — El Tomato, Jun 30 '21 at 22:32

score 0 · Answer 1 · answered Jun 29 '21 at 20:04

0

The blending mode on your MTLRenderPipelineDescriptor is not configured properly. You should use MTLRenderPipelineColorAttachmentDescriptor - a color render target that specifies the color configuration and color operations for a render pipeline, to configure your blending mode.

answered Jun 29 '21 at 20:04

Hamid Yusifli

9,688
2
24
48

Could you give me some more context? I would want to modify the alpha, right? – Bill Tudor Jun 29 '21 at 23:29

score 0 · Answer 2 · answered Jul 01 '21 at 16:13

The answer to this question solved my issue. I needed to add a shader to my node.

Is there really no way to style SKLabelNode?

This is the test shader I created.

void main()
{
    vec4 color = SKDefaultShading(); // the current label color
    
    //0.2 was determined to be a good roll off point
    if(color.a < 0.2){
        //@TOOD: Replace this with a uniform representing the background color
        color.r = 0.498;
        color.g = 0.278;
        color.b = 0.866;
        
        color.a = 1;
    }

    gl_FragColor = color;
}

Render SKLabel ontop of SKSprite

2 Answers2