Jump to content

Problem with buttons inside a sprite


Dario Gimenez
 Share

Recommended Posts

Hi, I have a problem when I add buttons in a sprite. The sprite works as a layer, so I can center all the game in the full width/height canvas.

 

I have two examples, the first one is working as I need, but the buttons aren't inside the sprite.

 

Example 1 - dariogimenez.com/phaser/test2.html

In this example, when you click the first button, a modal window is lauched. Over the first button, under the second button. This is what I need.



function preload()
{
game.load.spritesheet('button', 'button_common.png', 141, 48);
}

var button;
var button2;
var layer;
var modal;

function create()
{
game.stage.backgroundColor = '#ff0000';

var aux = getModal(0);
var layer = game.add.sprite(0, 0, aux.generateTexture());
layer.inputEnabled = true;
aux.destroy();

button = game.add.button(game.world.centerX, game.world.centerY, 'button', down, this, 0, 2, 1);
button.onInputOver.add(over, this);
button.onInputOut.add(out, this);
//layer.addChild(button);

var aux = getModal(0.5);
modal = game.add.sprite(0, 0, aux.generateTexture());
modal.inputEnabled = true;
modal.visible = false;
aux.destroy();
//layer.addChild(modal);

button2 = game.add.button(game.world.centerX, game.world.centerY + 100, 'button', down, this, 0, 2, 1);
button2.onInputOver.add(over, this);
button2.onInputOut.add(out, this);
//layer.addChild(button2);
}

function getModal(alpha)
{
var modal = game.add.graphics(0, 0);
modal.beginFill("#000000", alpha);
modal.drawRect(0, 0, 800, 600);
modal.endFill();
modal.boundsPadding = 0;

return modal;
}

function update()
{

}

function over() {

}

function out() {

}

function down (btn) {
if(btn == button)
{
modal.visible = true;
}
}

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


 

Example 2 - dariogimenez.com/phaser/test.html

This is the same example, but the buttons are inside a sprite (called layer). The layer is absorbing the button events. I don't know why.



function preload()
{
game.load.spritesheet('button', 'button_common.png', 141, 48);
}

var button;
var button2;
var layer;
var modal;

function create()
{
game.stage.backgroundColor = '#ff0000';

var aux = getModal(0);
var layer = game.add.sprite(0, 0, aux.generateTexture());
layer.inputEnabled = true;
aux.destroy();

button = game.add.button(game.world.centerX, game.world.centerY, 'button', down, this, 0, 2, 1);
button.onInputOver.add(over, this);
button.onInputOut.add(out, this);
layer.addChild(button);

var aux = getModal(0.5);
modal = game.add.sprite(0, 0, aux.generateTexture());
modal.inputEnabled = true;
modal.visible = false;
aux.destroy();
layer.addChild(modal);

button2 = game.add.button(game.world.centerX, game.world.centerY + 100, 'button', down, this, 0, 2, 1);
button2.onInputOver.add(over, this);
button2.onInputOut.add(out, this);
layer.addChild(button2);
}

function getModal(alpha)
{
var modal = game.add.graphics(0, 0);
modal.beginFill("#000000", alpha);
modal.drawRect(0, 0, 800, 600);
modal.endFill();
modal.boundsPadding = 0;

return modal;
}

function update()
{

}

function over() {

}

function out() {

}

function down (btn) {
if(btn == button)
{
modal.visible = true;
}
}

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


Do you have any idea?

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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