如何在Phaser(HTML)中制作和更新文本

时间:2016-03-27 18:50:52

标签: html5 phaser-framework

我创建了一个变量,它在创建函数中通过game.add.text(...)显示一个数字,但我希望每次按下按钮都会更新文本,因为变量会发生变化。如果我在更新功能中game.add.text(...),它会堆叠,并会出现许多层文本。

2 个答案:

答案 0 :(得分:2)

这是一个简单的版本,可以让您了解如何处理这个问题。

<script>
    var game = new Phaser.Game(400, 300, Phaser.AUTO, 'phaser-example', { preload: preload, create: create });
    // You'll need to make sure your button click action can access the number to display.
    var clickCount = 0;
    // We'll also need to keep track of the text object that we add to the game.
    var clickCounter;

    function preload() {
        game.load.image('button', 'assets/button.png');
    }

    function create() {
        game.stage.backgroundColor = '#124184';
        // When creating the text object, make sure it'll be accessible from our button handler.
        clickCounter = game.add.text(5, 5, 'Total clicks: ' + clickCount, { fill: '#ffffff', font: '14pt Arial' });

        game.add.button(200, 150, 'button', actionOnClick, this);
    }

    function actionOnClick() {
        clickCount++;
        // The key here is setText(), which allows you to update the text of a text object.
        clickCounter.setText('Total clicks: ' + clickCount);
    }
</script>

因此,不是创建新的文本对象,而是存储对您创建的文本对象的引用,并使用setText()进行更新。

答案 1 :(得分:0)

试试这个:

clickBtn:number = 0; //例如

game.add.text('Clicks'+ this.clickBtn);

this.btn = this.add.button(some code,this.yourFunction);

this.yourFunction(){

this.clickBtn + = 1;

}

我认为这会对你有所帮助。

此致,谢尔盖。