SpriteRenderer
Vaelis 1.0.0 SpriteRenderer component reference: fields, script API, behavior and examples.
#What it does
Draw a 2D texture sprite for an entity.
#How to add and use SpriteRenderer
Editor path: Select the target entity in the Hierarchy (left side) → look at the Inspector (right side) → click Add Component at the bottom of the Inspector → search for SpriteRenderer → click the component row. The Add Component picker is a centered modal with a search box; it only lists components not already attached.
For components with a dedicated editor tool, the tool is opened or activated from the location described below. Do not assume that adding the component alone activates its editor; some systems require a separate window, panel, or viewport tool.
#Component setup & editor tools
- Inspector → SpriteRenderer → sprite field: choose the sprite asset. Use the viewport to see the result. FlipX/FlipY are visual orientation controls; color/opacity change appearance without changing the source asset.
#What you should see after adding it
The component appears as its own section in the Inspector. Its serialized settings are listed in the Component data table below. If a field is conditional, it appears only when the relevant mode/type is selected. If a field is a runtime state field (for example grounded or resolved velocity), treat it as read-only diagnostic state unless the API reference explicitly documents it as writable.
#How to read the settings
For every setting below, the documentation distinguishes type, default, meaning, and tuning direction where behavior is known. When a value represents a direction, use the engine's coordinate convention documented in Coordinate system; do not substitute Unity/Godot conventions.
#Component data
| Field | Type | Purpose | Default |
|---|---|---|---|
spriteKey | string|null | Asset key for the sprite texture. | null |
color | hex string | Tint color. | #ffffff |
opacity | number | Opacity multiplier. | 1 |
flipX | boolean | Mirror horizontally. | false |
flipY | boolean | Mirror vertically. | false |
referenceWidth | number|null | Optional reference width used by rendering/layout. | null |
referenceHeight | number|null | Optional reference height used by rendering/layout. | null |
#Tuning behavior
These are the practical direction-of-change rules for the most important controls on this component.
| Setting | What changing it does |
|---|---|
opacity | 0 is invisible; 1 is fully opaque; values between are translucent. |
flipX / flipY | Boolean mirror. Flip X changes left/right without changing the Transform position. |
#Script API
| Member | Kind | Description |
|---|---|---|
texture | Property | Sprite asset key. |
color | Property | Hex tint color. |
flipX | Property | Horizontal mirror. |
flipY | Property | Vertical mirror. |
opacity | Property | Opacity. |
#Examples
this.sprite.texture = "target";this.sprite.flipX = input.keyDown("ArrowLeft");