Shohanur Rahaman Shohanur Rahaman - 4 months ago 144
Javascript Question

How to take text input in Phaser?

I am making a HTML5 game with Phaser, I want to take palyer name as input and save it for later use how can I do it with Phaser?


I've never seen a Flash game with HTML overlayed to handle text. I expect as Javscript game engines grow, they will ultimately find they also need to handle rendering text inside the canvas. The good news is that the work has already begun.

<script src="CanvasInput.min.js"></script>

    var bmd = this.add.bitmapData(400, 50);    
    var myInput =, 15, bmd);

    myInput.canvasInput = new CanvasInput({
        canvas: bmd.canvas,
    myInput.inputEnabled = true;
    myInput.input.useHandCursor = true;    

A Phaser and CanvasInput demo can be seen here,

One downside is that you must use canvas rendering in Phaser using Phaser.CANVAS and not Phaser.AUTO.

UPDATE: someone made this too