How to immediately add a sprite to the stage?

[nouse4aname]

I'm trying to display a sprite at the same time I'm setting game.paused=true;  For some reason, it doesn't work.  Here's what the code is doing:

class Announcement extends Phaser.Sprite {
    constructor(game, str, ttl) {
        super(game, game.width / 2, game.height);
        this.health = ttl;
        this.fixedToCamera = true;
        //this.anchor.setTo(0.5, 0.5);

        var style = {font: "28px Arial", fill: "#ffffff", wordWrap: false, align: "center"};
        var text = game.make.text(0, 0, str, style);
        text.setShadow(2, 2, 'rgba(0, 0, 0, 0.5)', 1);
        text.anchor.set(0.5, 1);
        this.addChild(text);
    }
}

// elsewhere

game.layers.ui.add(new Announcement(game, "Testing", 3000));
game.paused = true;

game.layers.ui is already added to the stage and is visible and works perfectly while the game is running.  But when I run this code, nothing is displayed while the game is paused.  Only once I set game.paused = false; does the sprite (which is only text) show up on the screen.  If, however, I change the code to say:

game.layers.ui.add(new Announcement(game, "Testing", 3000));
setTimeout(function() { game.paused = true; }, 100);

Then everything works perfectly, with the exception of the game continuing for an addition 100ms.

So what gives?

[samme]

Try

game.layers.ui.add(/*…*/);

game.stage.updateTransform();
// OR:
game.stage.postUpdate();

game.paused = true;

 

[nouse4aname]

This worked, thank you!