Sign in to follow this  
cseibert

Making a Zone

Recommended Posts

Does anyone have a good example of how to create a zone which invokes a callback function when a player enters / leaves the zone?  I am just trying to display some extra text when a player enters a zone, but I can't find any good examples using the Phaser3 Zone class.

I found a work around using the Rectangle object manually, but I'm assuming (hoping) there is an easier way to use the Zone class to setup this same functionality using enter / leave callbacks?

This is what I have done so far:

// create
this.zone = new Phaser.Geom.Rectangle(this.box.x - 25, this.box.y - 25, 50, 50);
this.player = this.physics.add.sprite(800, 600, 'player_handgun');
this.text = this.add.text(this.box.x + 20, this.box.y, "use", {
  font: "18px Arial",
  fill: "#ff0000",
  align: "center",
  backgroundColor: "#00ffff"
});
this.text.setOrigin(0.5, 0.5);
this.text.setVisible(false);

// update
if (Phaser.Geom.Rectangle.Overlaps(this.player.getBounds(), this.zone)) {
  this.text.setVisible(true);
} else {
  this.text.setVisible(false);
}

Again, ^ this approach works, but I rather find a way to use the Phaser's Zone class.  Some issues I have with this approach is I can't set the origin(0.5, 0.5) on the rectangle, so I have to calculate the zone offset manually.

Share this post


Link to post
Share on other sites

Zones don't really do their own overlap checks, but you could add an Arcade Physics body to a zone and then use an overlap collider, if you prefer that.

Even without a physics body, you could do 

Phaser.Geom.Rectangle.Overlaps(player.getBounds(), zone.getBounds())

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.