Add letterSpacing to Phaser.Text

[Akurn]

This PR:

• changes documentation
• changes the public-facing API

Describe the changes below:
Adds support for the new Canvas2D letterSpacing property, to the Phaser.Text object, as a new style config.

I also noticed letterSpacing exists as a property of the BitmapText object. So I added a getter/setter for it in Phaser.Text to match.

Example Usage:

let text = game.add.text(0, 0, 'Hello World', { letterSpacing: '10px' })
// or
text.letterSpacing = '20px'

JSFiddle Demo: https://jsfiddle.net/Akurn/r3zgd69x/

TODO:

• Update JSDocs static files?
• Update TypeScript definitions?
• Change Log

---

Note

Adds letterSpacing support to Phaser.Text, including rendering, measurement, JSDoc, and TypeScript typings.

• Phaser.Text:
  • Add style.letterSpacing (default '0px') with getter/setter text.letterSpacing.
  • Apply context.letterSpacing during render and measurement (updateText, measureLine), including tabbed layouts; width calculations now account for non-zero letterSpacing.
  • Extend JSDoc for constructors and setStyle to document letterSpacing.
• TypeScript:
  • Update PhaserTextStyle to include optional letterSpacing?: string.
  • Add letterSpacing: string to Phaser.Text typings.

^{Written by Cursor Bugbot for commit 08eaaec. This will update automatically on new commits. Configure here.}

[Akurn]

I can update the static doc files and typescript defs in this PR too. Just wasn't sure if there was a separate step for that.

[samme]

You can update the TypeScript definitions, but ignore the HTML docs, they're generated. Thanks.

[cursor]

This PR is being reviewed by Cursor Bugbot

Details

Your team is on the Bugbot Free tier. On this plan, Bugbot will review limited PRs each billing cycle for each member of your team.

To receive Bugbot reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial.

Bug: Complex Layout Ignores Letter Spacing

In the complex layout (tabs) section, the condition for using measureLine doesn't include letterSpacing check, unlike the simple layout at line 446. When tabs and letterSpacing are both used, text width calculations use context.measureText directly instead of measureLine, causing incorrect measurements that don't account for letter spacing.

src/gameobjects/Text.js#L469-L471

phaser-ce/src/gameobjects/Text.js

Lines 469 to 471 in 19c6bb4

	var tab = 0;
	for (var c = 0; c < line.length; c++)

 

---

[Akurn]

Thanks @samme I've added them to phaser.d.ts. It looks like phaser.comments.d.ts is also a generated file, so have left that out.

Let me know if there's anything else needed for the PR. Thank you!
Actually, those cursorbot issues look valid, will fix first.

[Akurn]

Have added fixes to the missing bits Cursor Bot brought up.
Also added more text tests to the JSFiddle to test per character styles and tabbing.