Button!

[Tourniquet]

Hi,

 

first of all I'm a total newbie to Phaser and JS. This is the first time i ever tried to create a little game

 

At the moment I've got a little problems with buttons. Before I started the game from the menu via

        var space_key = this.game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);        space_key.onDown.add(this.start, this);

Now i wanted to replace this, with a button but it does not work and I don't know why.

        var x = game.world.width/2, y = game.world.height/2;              startButton = game.add.button(x, y, 'startButton', this.start, this, 1, 0, 2);

I can see the button, but i can't click it. Nothing happens. Why? What am I doing wrong?

[BdR]

I can't see anything wrong with your code here, maybe your start() function is causing it to just halt or crash? Have you tried debugging by logging to console? So something like this:

function start() {    console.log('start() was called');    // ..your code here..    console.log('start() is finished');};

In Chrome browser you can open developer tools with CTRL+Shift+J and then look at console to see if your code reaches all of the console.log lines, if not then it crashed somewhere.

[Tourniquet]

Hi BdR,

thanks for your answer.

 

I use IE 11 and the F12 developer tools. Its not halting or crashing. I see the button, but i can not click it. I tried it a couple of times and found there is a point to click the button, but its not where the button is positioned and its very tiny.

var menu_state = {    create: function() {        // space        var space_key = this.game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);        space_key.onDown.add(this.start, this);            // touch		   game.input.onDown.add(this.start, this);		// Background		      game.stage.backgroundColor = '#72B6FA'; // fröhlich -> 72B6FA   düster -> A1ADB8     		menu_bg = game.add.tileSprite(0, 0, game.width, game.cache.getImage('menu_bg').height, 'menu_bg');        // Defining variables        var style = { font: "30px Arial", fill: "#000000" };        var x = game.world.width/2, y = game.world.height/2;        // If the user already played        if (score > 0) {            // Display its score            var score_label = this.game.add.text(x, y+50, "score: " + score, style);            score_label.anchor.setTo(0.5, 0.5);        }      // var startButton = game.add.button(x, y, 'startButton', this.start);    	//startButton.anchor.setTo(0.9,0.2);    },    // Start the actual game    start: function() {        this.game.state.start('play');    }};