Can't type WASD on Text Input

Phaser 3
1

I am creating a game where the player will interact with a certain device with a password. So the player requires entering the password to access the device however the problem is that I cannot type WASD on the input field. I used the text input example here: https://labs.phaser.io/edit.html?src=src%5Cgame%20objects%5Cdom%20element%5Cinput%20test.js

My controls:

this.a = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.A);
this.s = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.S);
this.d = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.D);
this.w = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.W);
    this.spaceKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SPACE);
// /// ///
if(this.d.isDown){
     /// code
}

if(this.a.isDown){
     /// code
}

// more code ...

Thank you in advance.

2

This appears to be an “unofficial” solution but it works, for now, hopefully, others can find this helpful too.

this.element = this.add.dom(825, 485).createFromCache('device_form');
this.element.addListener('click');
this.element.setVisible(true);
this.element.on('click', function (event) {

	if (event.target.name === 'playButton'){
        var inputText = this.getChildByName('nameField');

	    if (inputText.value !== '') {
	    	console.log(inputText.value);
	    } else {
        
        }
    }
}); 	

this.input.keyboard.on('keydown', function (event) {
   	if(event.key == 'a'){
   		this.element.getChildByName('nameField').value+=event.key;
   	}else if(event.key == 's'){
   		this.element.getChildByName('nameField').value+=event.key;
   	}else if(event.key == 'd'){
   		this.element.getChildByName('nameField').value+=event.key;
   	}else if(event.key == 'w'){
   		this.element.getChildByName('nameField').value+=event.key;
   	}
}.bind(this));
3

Use

this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.A, false)

etc.

1 Like
4

This is a much cleaner solution <3