Tilesprite width / height not respected one dimension is zero

[GaryStanton]

Version

• Phaser Version: 3.80.0
• Operating system: Windows 10
• Browser: all

Description

If you set a tilesprite with a zero width or height, and specify the other dimension - while it does take the dimensions from the texture, as it should, it doesn't tile the sprite to the other dimension.

So for example, if I have a texture that is 100x100px, I would expect the following code to result in a tile sprite that is 100px wide and 500px high, with my texture tiled five times vertically:
this.add.tileSprite(0, 0, 0, 500, 'my100pxTexture')

However, it simply results in a tilesprite of 100x100px, matching the dimensions of the texture.

Example Test Code

https://phaser.io/sandbox/4nryhSBH

[greptile-apps]

For internal use only

To address the issue where a TileSprite does not tile correctly when one dimension is zero, modify the TileSprite class in TileSprite.js as follows:

1. In the TileSprite constructor, update the width and height assignment to ensure tiling is applied correctly:

if (!width || !height) {
    width = width || displayFrame.width;
    height = height || displayFrame.height;
} else {
    width = Math.floor(width);
    height = Math.floor(height);
}

2. In the setFrame method, ensure the canvas dimensions are updated correctly:

if (!newFrame.cutWidth || !newFrame.cutHeight) {
    this.renderFlags &= ~_FLAG;
} else {
    this.renderFlags |= _FLAG;
}

this.displayFrame = newFrame;

this.dirty = true;

this.updateTileTexture();

// Ensure the canvas dimensions are updated
this.canvas.width = this.width || newFrame.width;
this.canvas.height = this.height || newFrame.height;

return this;

These changes ensure that the TileSprite respects the specified dimension and tiles the texture correctly when one dimension is zero.

References

/src/gameobjects/tilesprite/TileSprite.js
/src/gameobjects/tilesprite/TileSpriteFactory.js
/src/gameobjects/tilesprite/TileSpriteCreator.js

About Greptile

This response provides a starting point for your research, not a precise solution.

Help us improve! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

Ask Greptile · Edit Issue Bot Settings

[zekeatchan]

Hi @GaryStanton. Thanks for submitting this issue. We have fixed this and pushed it to the master branch. It will be part of the next release. Do test it out and let us know if you encounter any issues.

[codingthat]

@zekeatchan this appears to be a regression in 4.0.0-beta.1. You can verify this easily thanks to @GaryStanton 's sandbox MRE.

[BenjaminDRichards]

@codingthat I cannot replicate, but that just means my device isn't affected by the issue. Can you describe the system (browser, version, operating system) where the problem occurs? This will help us identify possible issues.

[GaryStanton]

@BenjaminDRichards I can replicate this in Chrome and Firefox. There's a simple test case at https://phaser.io/sandbox/4nryhSBH, and if you switch between 3.87.0 and 4.0.0 Beta 1, you can see the difference.

[BenjaminDRichards]

Aha, I see what's going on. Thanks for illustrating it!

TileSprite checks for valid width and height when it's created. In the 4.0.0-beta1 code, the check fails if either dimension. It falls back to using the frame dimensions, i.e. the size of one sprite.

It seems more logical to check each dimension independently, so that here the intended height is preserved. I'll implement that now; it should be in beta2 very soon.