[title: "ExperienceBar Class"] ← Back to index

Visual experience progress bar

[heading: "Description"]

A progress bar showing experience or ANY / similar 0-to-1 value. It is drawn from three stacked graphics objects: a dark track, a teal fill scaled by progress, and a white border. Updating progress redraws the fill to match the current value.

[heading: "Key Features"] [list] * Clamped 0-1 progress updates * Built-in background, fill and border graphics [/list] [heading: "Constructor"] [table header] [ Parameter | Type | Description ] [ x | Number | X position of the bar ] [ y | Number | Y position of the bar ] [ width | Number | Width of the bar ] [ height | Number | Height of the bar ] [/table] [heading: "Properties"] [table header] [ Property | Type | Description ] [ barWidth | Number | Width of the bar ] [ barHeight | Number | Height of the bar ] [ progress | Number | Current progress between 0 and 1 ] [ background | Phaser.Graphics | Dark track behind the fill ] [ bar | Phaser.Graphics | Teal fill scaled by progress ] [ border | Phaser.Graphics | White border around the bar ] [/table] [heading: "Methods"] [table header] [ Method | Parameters | Description ] [ setProgress | (progress) | Sets the progress value clamped to 0-1 and redraws the fill. ] [ updateBar | () | Redraws the fill graphics to match the current progress. ] [ destroy | () | Destroys the track, fill, border and the bar sprite itself. ] [/table] [heading: "Example Usage (Modding)"] [codeblock javascript] // Modding usage example const bar = new ExperienceBar(10, 10, 300, 20); game.add.existing(bar); bar.setProgress(0.75); [/codeblock] [footer: "© Retora 2026"]