# Phaser3 Game Objects to create in-game pause dialog with text and button?

**URL:** <https://phaser.discourse.group/t/phaser3-game-objects-to-create-in-game-pause-dialog-with-text-and-button/12192>\
**Category:** Phaser 3\
**Created:** [August 21, 2022, 11:01am UTC](https://phaser.discourse.group/t/phaser3-game-objects-to-create-in-game-pause-dialog-with-text-and-button/12192 "2022-08-21T11:01:32Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![BdR](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/bdr/32/2621_2.png) [@BdR](https://phaser.discourse.group/u/BdR)\
**Post date:** [August 21, 2022, 11:01am UTC](https://phaser.discourse.group/t/phaser3-game-objects-to-create-in-game-pause-dialog-with-text-and-button/12192/1 "2022-08-21T11:01:32Z")

</div>

What is the best way to do a short in-game dialog, so on top of the game scene? It should show some short text “Your inventory” or “Back to main menu YES / NO” or something like that.

I couldn’t find any like this [in the examples](https://phaser.io/examples), so how to combine Phaser3 Game Objects like graphics, containers etc. into a dialog like this.

In another thread someone suggested just [starting a different scene](https://phaser.discourse.group/t/creating-a-menu-pause-the-game/9455/2), but then the current game scene area is not visible anymore. Currently I have this code below and it works, but I would like to hear some feedback. Maybe there are different game objects that I could use, or there is some better way to do this?

```javascript
class MyDialogObj extends Phaser.GameObjects.Container {

	constructor(scene) {

		// pass parameters to the class we are extending, call super
		super(scene);
		
		// add to scene
		scene.add.existing(this);
		
		// other variables
		this._scene = scene; // keep scene reference

		// create dialog panel
		var rect = scene.add.rectangle(0, 0, 480, 320, 0x000000, 0.5);
		rect.setOrigin(0, 0);
		
		
		// create contents of panel
		this._dialog_txt = scene.add.bitmapText(240, 144, "fontwhite", "test 123 dialog", 40);
		this._dialog_txt.setOrigin(0.5).setCenterAlign();

		// add all to container
		this.add(rect);
		this.add(this._icon);
		this.add(this._dialog_txt);

		// invisible for now
		this.setVisible(false);
		this.setDepth(50); // always on top
		
		// center horizontally
		this.x = parseInt((GAME_WIDTH - 480) / 2);
	}

	doShowDialog(txt) {
		// set text message
		this._dialog_txt.text = txt;
		
		// place offscreen and set close button invisible
		this.y = -512;

		// now container is visible but off screen
		this.setVisible(true);

		// pop everything into screen
		var timeline = this._scene.tweens.timeline({
			ease: "Power2",
			tweens: [{ // drop container from top of screen
				targets: this,
				y: 160, // center vertically (640 - 320) / 2
				duration: 500,
				offset: 0
			}]
		});
	}

	doCloseDialog() {
		
		// remove from screen
		var timeline = this._scene.tweens.timeline({
			ease: "Power2",
			tweens: [{ // drop container from top of screen
				targets: this,
				y: -512,
				duration: 500,
				offset: 0
			}]
		});

		// continue scene
		this._scene.closeDialogCallBack();
	}
}

```

And in the main game scene I create a `new` dialog object, and there is a callback function to open and close the diaglog and continue/unpause the game, like so:

```javascript
var GameScene = new Phaser.Class({

	Extends: Phaser.Scene,

	initialize:
	//..
	create: function ()
	{
		this._dialog = new DialogObj(this);
		// etc.
	},

	closeDialogCallBack: function() {
		// un-pause game etc.
	},

```

---

<div class="post-metadata">

**Author:** ![Tastey](https://avatars.discourse-cdn.com/v4/letter/t/b3f665/32.png) [@Tastey](https://phaser.discourse.group/u/Tastey)\
**Post date:** [August 23, 2022, 12:25pm UTC](https://phaser.discourse.group/t/phaser3-game-objects-to-create-in-game-pause-dialog-with-text-and-button/12192/2 "2022-08-23T12:25:13Z")

</div>

A seperate scene is the way to go! If you use scene.launch() instead of scene.start() the game scene wont shut down.

If it´s a pause menu you would probably want to use scene.pause() and scene.resume() on your game scene to actually pause/unpause your game.