Drawing Text on Screen
UI.drawText(text, x, y, color, size) puts text on screen — health, score, a level counter, anything that needs to be visible while you play.
export function update(self) {
UI.drawText("Health: " + self.health, 20, 20);
}
xandyare where the text starts (from the top-left).colorandsizeare optional — leave them out for white, 20-pixel text, or set them yourself:UI.drawText("Health: 100", 20, 20, "red", 32).
Call it every frame, from inside update() — not just once. Unlike a shape, text doesn't stay on screen by itself; each frame redraws the whole game from scratch, so if you only draw the text once, it disappears the very next frame.
export function update(self) {
// Right: called every frame, so it keeps showing.
UI.drawText("Health: " + self.health, 20, 20);
}
Text drawn this way stays visible even while the game is paused by a message (see "Showing a Message") — so a "Health: 0" HUD stays readable behind a "Game Over" screen instead of vanishing.
Building a number into the text needs
+, like "Health: " + self.health — this joins the words "Health: " and whatever number self.health currently is into one piece of text.