Hi
I’m starting with Phaser and I have a question.
how to create input text in phaser 3?
Thank’s
2 Likes
Phaser does not have native input components. You can use DOM elements to do this. See example here:
1 Like
When you search for phaser3 documentation type stuff you will often wind up in the impressive phaser3-notes repo maintained by rexrainbox:
Inside this is a HUGE collection of plugins for phaser3 including an extensive ui system including just about every kind of pre-made GUI widget you could think of … except for text input! There are lots of widgets for showing pre-made text and even making the text slowly type in over time (like a dialog in an RPG) and I bet one of those could be used to make a user input widget pretty easily. I’d expect these will offer a lot more control over the appearance and will fit better in a Phaser based GUI than native HTML inputs (unless you’re a CSS wizard).
You’re kind of on your own exploring the repo (I am not Rex) but if you are comfortable with nodejs projects the repo is straightforward. It is setup with a BUNCH of examples that you can execute without much trouble that help you learn by doing. Just a resource to be aware of.
Seth B.
1 Like
Sudhir is quite right. You’ll need to use Dom elements. I just wrote a post on this with some example code.
1 Like
The problem is that inputting text, especially numbers, is vital to a lot of projects. Having only a slider bar doesn’t cut it for poker for example.
The biggest problem is not on desktop, where it is easy to workaround, it is on mobile, where the browsers just won’t deal with it properly without a DOM element.
That Element Input Test demo fails for me, using Chrome 72.0.3626.109
I get “this.add.dom is not a function” in the console.
It won’t work on that page. You have to go to the previous page and select dev build. Then you can download the dev build too and mess around with it.
It works, but it’s useless as far as what most people actually need to do.