Body's Bounding Box is off after reseting Sprite

[JTronLabs]

I am attempting to recycle sprites, and upon recycling I change their size. Unfortunately the body's setSize method is not functioning as hoped.

In the picture, the important thing to look at is the orange-ish ship in the middle right whose green bounding box is only covering his top left. The red ship's bounding box is in the top left (I think), and I am not sure why it is not following him (but it works fine). I move Mr Red Ship around via

this.game.physics.arcade.moveToPointer(this, this.speed);

Anyways, the console statements in the picture log the sprite's width, height and then the body's width, height. Even though they match in the console, they do not match in the game world.

 

The code below is the parent of the sprites that does all the heavy lifting. I use the reset(...) function to revive sprites that have had kill() called on them. The reset function calls setAreaMaintainAspectRatio, which does the resizing. I've tried removing the setSize call in it, replacing it with a reset(), etc but nothing I've done has gotten those crisp bounding boxes back.

 

/*
 * ParentSprite
 * ====
 *
 */

export default class ParentSprite extends Phaser.Sprite {

  constructor(game){
    super(game);

    this.game.physics.arcade.enable(this);
  }

  reset(x, y, health, width = 50, key, frame){
    super.reset(x, y, health);
    //this.body.reset();

    this.loadTexture(key, frame);
    this.setAreaMaintainAspectRatio(width);
    this.body.velocity.x = 20
  }

  update(){
    this.game.debug.body(this,'rgba(0,255,0,0.4)');
    //this.game.debug.bodyInfo(this, this.x, this.y);
  }

  //give the sprite a new size while maintaining aspect ratio
  setAreaMaintainAspectRatio(width){
    const newWidth = ParentSprite.dp(width);

    this.width = newWidth;
    this.scale.y = Math.abs(this.scale.x);

    //set body to new sprite size, otherwise collisions (and other physics actions) will be messed up
    if(this.body) {
      this.body.setSize(this.width,this.height);
    }
    console.log(this.width, this.height, this.body.width, this.body.height);
  }

  //density independent pixels
  static dp(length, heightOrWidth, parent){
    return length * window.devicePixelRatio;
  }


}

Any and all help is much appreciated!!

 

 

I have found this topic 

 saying that I should just reset the body after changing width/height, but that doesn't work for me.

[JTronLabs]

Solved it! It may not be the 'right' way to do it, but it works. Reseting the body and changing its size did not work for me, I had to completely re-enable it. Not sure if this will cause problems to re-enable a body a bunch of times on a recycled sprite, but I think it'll be fine. Would be interested in hearing about others' solutions to this problem though.

 

//give the sprite a new size while maintaining aspect ratio
  setAreaMaintainAspectRatio(width){
    this.width = ParentSprite.dp(width);
    this.scale.y = Math.abs(this.scale.x);

    //due to the weird way Phaser works, this.body.setSize (and many other things) will cause the bounding box to be the wrong size after the Sprite's width/height changes
    //Instead, completely re-enable the body phsics on this in order for the bounding box to match the image size
    this.game.physics.arcade.enableBody(this);
  }