Click sprite and button question

[claire]

How to detect if I click on a sprite?

I use this:

sprite.input.pointerDown()

This is not working.

And how do I set useHandCursor to true for sprite?

 

-------------------------------------------------------------------

 

Another question,

how can I change a button image when click? It's not after mouseUp will bounce back, I would like to to stay on that state until next click, can it be done?

 

 

[XekeDeath]

I cant think of any instances in our current project where we click on or mouse over sprites, only buttons...

 

But I can provide a quick answer to your second question, as that was something I did last week.

Basically, I added a variable called "on" to the button that would switch between true and false in the buttons callback.

This was added at creation time with:

var newButton = new Phaser.Button(game, 0, 0, imageKey, this.buttonCallback, this, 1, 0, 2);newButton.on = false;

Then, depending on what "on" state the button was in, I would change the frames of the button.

//The first argument to a button callback is the button itself.buttonCallback = function (btn){    btn.on = !btn.on;    btn.setFrames(1, (btn.on)?2:0, 2);    btn.frame = (btn.on)?2:0;}

This works by making the 'up' frame of the button the 'down' frame in the source image, and reverting it when the button is clicked again. Effectively making your button appear pressed after it is clicked and the mouse leaves the bounds.

[haden]

Here is an example that changes the frame of a sprite if the pointer is down over the sprite. It worked fine for me on desktop and mobile.

var TestSprite = {	create: function() {		this.sprite = game.add.sprite(100, 100, 'my sprite');		this.sprite.input.start(); // start the inputHandler of the sprite	},	update: function() {                // test if the pointer is down over the sprite		if (this.sprite.input.pointerDown(game.input.activePointer.id)) {			this.sprite.frame = 1;		} else {			this.sprite.frame = 0;		}	},}

[claire]

I cant think of any instances in our current project where we click on or mouse over sprites, only buttons...

 

But I can provide a quick answer to your second question, as that was something I did last week.

Basically, I added a variable called "on" to the button that would switch between true and false in the buttons callback.

This was added at creation time with:

var newButton = new Phaser.Button(game, 0, 0, imageKey, this.buttonCallback, this, 1, 0, 2);newButton.on = false;

Then, depending on what "on" state the button was in, I would change the frames of the button.

//The first argument to a button callback is the button itself.buttonCallback = function (btn){    btn.on = !btn.on;    btn.setFrames(1, (btn.on)?2:0, 2);    btn.frame = (btn.on)?2:0;}

This works by making the 'up' frame of the button the 'down' frame in the source image, and reverting it when the button is clicked again. Effectively making your button appear pressed after it is clicked and the mouse leaves the bounds.

 

Thanks XekeDeath! It's working GREAT!! 

[claire]

 

Here is an example that changes the frame of a sprite if the pointer is down over the sprite. It worked fine for me on desktop and mobile.

var TestSprite = {	create: function() {		this.sprite = game.add.sprite(100, 100, 'my sprite');		this.sprite.input.start(); // start the inputHandler of the sprite	},	update: function() {                // test if the pointer is down over the sprite		if (this.sprite.input.pointerDown(game.input.activePointer.id)) {			this.sprite.frame = 1;		} else {			this.sprite.frame = 0;		}	},}

 

Thanks haden! It's working, but because of in update, so it will go back to the frame before click when I mouse up. Anyway, I did found the solution from XekeDeath! Thanks again!