Sign in to follow this  

increase sprite hit area without increasing its body

Recommended Posts

I would like to increase a sprite's hit area so that its easier to tap on it on mobile. I would like to keep its body the same size however as there are collisions in the game that depend on it. How can I accomplish this? 


I tried 

paddle.body.setSize(500, 200, 0, 0);


but this seems to increase the body size, screwing up collisions.



Share this post

Link to post
Share on other sites

There is a hitArea property on all pixi DisplayObjects, which Phaser's objects inherit from. You can feed this a new Phaser.Rectangle like so:

// add a hypothetical 10x10 sprite
var sprite = game.add.sprite(0, 0, 'test');

// make the hit area 20x20 - note you can also use negative figures for the first two params (x and y) to offset it from the sprite
sprite.hitArea = new Phaser.Rectangle(0, 0, 20, 20);

I don't know for sure if this works with all input methods but I've tested it with dragging and it works fine there.

Share this post

Link to post
Share on other sites

Hi, lewster32 says good tip.
But you should remember about sprite anchor

So, I use such a universal snippet.  Positive HIT_AREA_PADDING increase hit area, negative - shrink it


sprite.hitArea = new Phaser.Rectangle( 
        sprite.width + HIT_AREA_PADDING * 2,
        sprite.height + HIT_AREA_PADDING * 2


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.