Display Class

The Display class is the foundation of every TCJSgame project. It represents the canvas and manages the game loop. You use it to start the game, clear the screen, and switch between different scenes. The display is responsible for drawing all components that belong to the active scene, making it the heart of rendering. Without it, nothing would appear on the screen.

When you create a new Display instance, you must call start(width, height) to initialize the canvas. You can then use other methods such as clear(), stop(), or fullScreen(). In v3, gradients are supported with lgradient() and rgradient(), making it easy to create visually interesting backgrounds without additional images.

Syntax

const display = new Display();
display.start(800, 600);

Methods

• start(width, height) – initialize canvas and start loop.
• clear() – clear the screen each frame.
• stop() – pause or stop the game loop.
• fullScreen() / exitScreen() – toggle fullscreen mode.
• lgradient() / rgradient() – create gradient backgrounds.

Example

const display = new Display();
display.start(600, 400);
display.lgradient("right", "blue", "lightblue");

Notes

• Always call display.start() before adding components.
• The default background is white unless changed.
• Gradients can be vertical or horizontal depending on parameters.