Jump to content
GameMonetize.com © The leading broker of high quality cross-platform HTML5 games ×

Phaser 2.4.8 - Update Text

QuimB

By QuimB,
in Phaser 2

 Share

Recommended Posts

QuimB Newbie

QuimB

Posted
Posted

Hello,

I'm brand new to programming and Phaser. My first project is a very simple incremental game. I'm using MAMP with Phaser 2.4.8.

Every time I click on the button, the text score doesn't increment. 

I have the console opened. There aren't any error messages displayed. http://imgur.com/Kq3BzUF

I'm stumped and don't want to add new features to the game until this issue is solved.

Thanks for the help.

index.html 

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8" />
    <title>Jogo 1: Sem Título</title>
    <script type="text/javascript" src="js/phaser.min.js"></script>
    <script type="text/javascript" src="js/main.js"></script>
</head>
<body>
    <p>Meu 1º Jogo com Phaser</p>
    <div id="TheGame"></div>
</body>
</html>

main.js 

ar game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create });

var scoreText;
var clicks;

function preload() {


    game.load.image('clickBox', 'assets/ClickMe.png');
    game.stage.backgroundColor = '#182d3b';

}

function create() {

	clicks = 0;
    var button = game.add.sprite(game.width/2, game.height/2, 'clickBox');

    scoreText = game.add.text(30, 30, "CLICKS: " + clicks, {
        font: "20px Arial",
        fill: "#ffffff",
        align: "left"

    });

    button.scale.x = 0.5;
    button.scale.y = 0.5;
    button.anchor.setTo(0.5);
    button.inputEnabled = true;

    function update () {

    	button.input.onDown.addOnce(UpScoreText, this);

    }

    function upScoreText () {

    	clicks++;
    	scoreText.setText("CLICKS: " + clicks);
    }



}

 

Link to comment
Share on other sites
QuimB Newbie

QuimB

Posted
  • Author
Posted

Thanks for the help.

I replaced  

    	button.input.onDown.addOnce(UpScoreText, this);

with

  

    	button.input.onDown.addOnce(upScoreText, this);

But the problem still remains. Not sure if I'm still missing something.

Link to comment
Share on other sites
Taggrin Newbie

Taggrin

Posted
Posted
5 minutes ago, QuimB said:

Thanks for the help.

I replaced  


    	button.input.onDown.addOnce(UpScoreText, this);

with

  


    	button.input.onDown.addOnce(upScoreText, this);

But the problem still remains. Not sure if I'm still missing something.

I just noted that your Update and upScoreText function are inside the Create function. I bet moving them out will fix the issue.

Link to comment
Share on other sites
QuimB Newbie

QuimB

Posted
  • Author
Posted

 

Thanks for the replies, but I'm still having issues.. This is what I have at the moment. 

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create });

var scoreText;
var clicks;

function preload() {


    game.load.image('clickBox', 'assets/ClickMe.png');
    game.stage.backgroundColor = '#182d3b';

}

function create() {

	clicks = 0;
    var button = game.add.sprite(game.width/2, game.height/2, 'clickBox');

    scoreText = game.add.text(30, 30, "CLICKS: " + clicks, {
        font: "20px Arial",
        fill: "#ffffff",
        align: "left"

    });

    button.scale.x = 0.5;
    button.scale.y = 0.5;
    button.anchor.setTo(0.5);
    button.inputEnabled = true;
}

function update () {

    	button.input.onDown.addOnce(upScoreText, this);

}

function upScoreText () {

    	clicks++;
    	scoreText.setText("CLICKS: " + clicks);
}

I've checked this tutorial and tried to replace this line: 

    	button.input.onDown.addOnce(upScoreText, this);

with

        button.events.onInputDown.add(upScoreText, this)

But still no results. Could the problem be somewhere else?

I was watching the first line of the file 

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, });

and noticed it doesn't have the update: update state(?). So I added it: 

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update });

But when I refresh the page, it displays the following console error:

main.js:34 Uncaught ReferenceError: button is not defined (main.js:34)

Link to comment
Share on other sites
Taggrin Newbie

Taggrin

Posted
Posted
9 hours ago, QuimB said:

But when I refresh the page, it displays the following console error:

main.js:34 Uncaught ReferenceError: button is not defined (main.js:34)

That is because you have "var" in front of the button variable. This will make the variable within the Create function, which is not global, hence why the Update function does not recognize it.

But since you are trying to make a button anyway, why don't you use the button function in Phaser? It makes it really easy to call a function upon press and if you have a spritesheet of your button you can make it have different looks when you hover/press it to give your menu more depth.

Something like this: 

function create() {
   //Create button (x, y, sprite, function upon press)
   button = game.add.button(game.width/2,game.height/2,'clickBox',upScoreText);
   //Create text area
   clicks = 0;
   scoreText = game.add.text(30, 30, "CLICKS: " + clicks);
}

function update() {
}

function upScoreText() {
   //Increase clicks and update text
   clicks++;
   scoreText.setText("CLICKS: " + clicks);
}

More info, including the use of a spritesheet: http://phaser.io/examples/v2/buttons/action-on-click

Link to comment
Share on other sites
drhayes Newbie

drhayes

Posted
Posted

Also, you don't want to add signal handlers in update like that. "update" runs (ideally) around 60 times a second. You really only need to tell Phaser to listen for a button click once (whether you use add or addOnce). You should move that line to "create". Or use the game.add.button function like Taggrin's got up there.

Link to comment
Share on other sites
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...