Sign in to follow this  
pranadevil

how to know if the mouse pointer is over a sprite/bitmap

Recommended Posts

    this.inputEnabled = true;   this.events.onInputOver.add(function(){	   console.log(game.input.activePointer.x);	   console.log(game.input.activePointer.y);   }, this);

i made this with my sprite who extends the sprite class, so you should replace this with the sprite or image itself

Share this post


Link to post
Share on other sites
render: function () {     this.game.debug.text('x: ' + this.game.input.x, 5, 15);      this.game.debug.text('y: ' + this.game.input.y, 5, 30);}

The above method will print text in top most left corner with the input x and y. (this is just useful for building and deving a game / app)

 

To check if you are in the same area, I use the object.over and object.out functions:

this.sprite = this.add.image(x, y, 'cacehAsset');this.sprite.inputEnabled = true;this.sprite.events.onInputOver.add(this.over, this);this.sprite.events.onInputOut.add(this.out, this);over: function(object) {        console.log('Input device is inside object', object);        console.log('current x: ', this.game.input.x, 'current y: ', this.game.input.y');        console.log('relative x: ', this.game.input.x - object.x, 'relative y: ', this.game.input.y - object.y);},out: function(object) {        console.log('Input device is no longer inside object', object);	},

1. The first console log fires when the input device has entered the bounds of the object in question. 

2. The second console log displays the users current x / y cords.

3. The third console log shows you the actual x and y within the object itself. if you're sprite is at say, x: 200, y: 300, and your pointer is 201, 316.. this will show you x: 1, y: 16. (relative position).

4 The fourth console fires when the input has left the object in question.

 

We know that the object in console log 3 is the right object as the method is requiring one parameter, and above, we are passing it that parameter by using (this.over, this); thus passing that specific object to the over method. 

 

Hope this helps.

 

Nick

Share this post


Link to post
Share on other sites
render: function () {     this.game.debug.text('x: ' + this.game.input.x, 5, 15);      this.game.debug.text('y: ' + this.game.input.y, 5, 30);}

The above method will print text in top most left corner with the input x and y. (this is just useful for building and deving a game / app)

 

To check if you are in the same area, I use the object.over and object.out functions:

this.sprite = this.add.image(x, y, 'cacehAsset');this.sprite.inputEnabled = true;this.sprite.events.onInputOver.add(this.over, this);this.sprite.events.onInputOut.add(this.out, this);over: function(object) {        console.log('Input device is inside object', object);        console.log('current x: ', this.game.input.x, 'current y: ', this.game.input.y');        console.log('relative x: ', this.game.input.x - object.x, 'relative y: ', this.game.input.y - object.y);},out: function(object) {        console.log('Input device is no longer inside object', object);	},

1. The first console log fires when the input device has entered the bounds of the object in question. 

2. The second console log displays the users current x / y cords.

3. The third console log shows you the actual x and y within the object itself. if you're sprite is at say, x: 200, y: 300, and your pointer is 201, 316.. this will show you x: 1, y: 16. (relative position).

4 The fourth console fires when the input has left the object in question.

 

We know that the object in console log 3 is the right object as the method is requiring one parameter, and above, we are passing it that parameter by using (this.over, this); thus passing that specific object to the over method. 

 

Hope this helps.

 

Nick

 

 

 

 

thanks for the help and explanation i really appreciate the time you took writing that mini tuto :lol:

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.