API reference
Every public class, method, and event in @codexo/exojs. Generated from source.
classBitmapText
@codexo/exojs / rendering / stable
Text node that renders from an offline-generated atlas - either a BMFont (AngelCode .fnt + .png) or an MSDF atlas (msdf-atlas-gen + .json). The atlas is pre-built so there is no runtime Canvas 2D rasterisation. All layout features (alignment, word-wrap, justify, leading, breakWords, whiteSpace, letterSpacing) and kerning pairs from the descriptor are fully supported. Outline effects are handled as shader uniforms - no extra draw calls, no atlas rebuilds. ## Usage ```ts const font = await loader.load(Asset.type('bmFont', 'fonts/ui.fnt')); // BmFont, no setup needed const label = new BitmapText('Score: 0', font, { msdf: true }); scene.addChild(label); label.text = 'Score: 42'; // cheap - marks the geometry stale label.style.align = 'center'; // cheap - same pending pass ``` Mutating any number of properties in the same frame is cheap; the geometry is rebuilt at most once, on demand.
45
props
43
methods
14
events
Import
import { BitmapText } from '@codexo/exojs'Text node that renders from an offline-generated atlas - either a BMFont (AngelCode .fnt + .png) or an MSDF atlas (msdf-atlas-gen + .json).
The atlas is pre-built so there is no runtime Canvas 2D rasterisation. All layout features (alignment, word-wrap, justify, leading, breakWords, whiteSpace, letterSpacing) and kerning pairs from the descriptor are fully supported. Outline effects are handled as shader uniforms - no extra draw calls, no atlas rebuilds.
## Usage
```ts const font = await loader.load(Asset.type('bmFont', 'fonts/ui.fnt')); // BmFont, no setup needed const label = new BitmapText('Score: 0', font, { msdf: true }); scene.addChild(label);
label.text = 'Score: 42'; // cheap - marks the geometry stale label.style.align = 'center'; // cheap - same pending pass ```
Mutating any number of properties in the same frame is cheap; the geometry is rebuilt at most once, on demand.
Constructors1
new(text: string, font: BmFontA loaded BMFont asset: the parsed descriptor plus all page textures. Loaded by the built-in BMFont factory - no extra setup required. Pass directly to BitmapTe…, options: BitmapTextOptions): BitmapTextMethods43
Take the heaviest pending hint and settle the node, folding in whatever the attached TextStyle has latched since the last pass. A style carries its own dirty flag because it is mutated in place rather than assigned, so polling it here is what makes label.style.align = ... land.
Mark the laid-out geometry stale without laying anything out. Subclasses call this from every setter that affects the glyph run. The content stamp is not deferred with the pass - see _onStyleChange for why a retained subtree has to learn about the change immediately even though the geometry can wait.
_replaceStyle(style: TextStyleText styling options carried by a TextObject.): voidSwap the attached style, moving the in-place-mutation subscription with it so the replaced style stops driving this node.
Run one layout pass. Subclasses supply the glyph provider and style. hint is the heaviest change this pass has to account for: only 'font' invalidates the glyph source, so a subclass that pays to acquire one can reuse its cached provider for a plain 'layout' pass.
_updateOrigin(): voidAnchor against the ADVANCE box, not against the local (ink) bounds. The base implementation derives the origin from getLocalBounds(), which is right for every node whose extent is its content. Text is the exception: its ink carries SDF padding that reaches past the glyphs on all four sides, by a different amount on each. Anchoring against it would centre the padded tile rather than the text, and would push an UNanchored label off its own position by the left/top padding. The typographic box is what a caller means by "centre this caption".
blur(): thisRelease keyboard focus from this node if it currently holds it.
clearFilters(): thiscollect(builder: RenderPlanBuilder, seq?: number): voidContribute this node to the render plan under construction: skip it when it is destroyed, invisible, or outside the builder's cull rect, otherwise emit it as one plan entry. Custom node types override this to add their own admission rules and must call super.collect(builder, seq) to keep the skip semantics. seq orders the entry within its parent; omit it to append. Part of the renderer SDK contract for extension renderers.
collidesWith(target: CollidableContract for objects that participate in collision detection. Implemented by all concrete shape classes as well as `SceneNode`.): CollisionResponseResult of a successful Collidable.collidesWith call. Contains the two participating shapes, the penetration depth, containment flags, and the minimum-translati… | nullCompute a full CollisionResponse between this shape and target. Returns null in two cases: - the shapes do not overlap, **or** - the specific shape-pair combination does not support response generation (e.g. Line against any shape, Ellipse against Ellipse or Polygon). Use intersectsWith for a universal boolean overlap check that works across all supported shape pairs.
contains(x: number, y: number): booleanHit-test the world-space point (x, y) against this node, honouring hitArea: with one set, the point is mapped into local space and tested against the shape; without one, the inherited bounds/oriented-box test applies. A subclass that overrides this with its own geometry test must forward to super.contains while hitArea is set, or the override silently defeats the caller's pick shape.
destroy(): voidReleases everything this node owns, including GPU-side resources. Calling it is mandatory for a node that has acted as a render root: from its first recorded frame such a node owns a group-scoped instance, transform and tint buffer, and the backend holds that bundle until the node is destroyed or the backend itself is. Dropping the last reference is not enough - GPU lifetime is deterministic here on purpose and is not tied to garbage collection. Idempotent: a second call is a no-op.
focus(): thisRequest keyboard focus for this node through its owning focus service.
getBounds(out?: RectangleMutable axis-aligned rectangle defined by a top-left origin `(x, y)` and dimensions `(width, height)`. Implements Collidable with full SAT collision response f…): RectangleMutable axis-aligned rectangle defined by a top-left origin `(x, y)` and dimensions `(width, height)`. Implements Collidable with full SAT collision response f…Axis-aligned bounding box of this node in its GLOBAL-transform space. That is world space for ordinary nodes, but GROUP-LOCAL space for nodes inside an engaged RetainedContainer transform group (the group matrix is applied on the GPU, not here) - this is deliberate and matches the rendering convention. For a true world-space extent of such a node, lift this rect by the group's getWorldTransform matrix. Pass out to receive a copy you own. Without it the return value is this node's **cached** rectangle, rebuilt in place whenever the transform or the local extent changes - retaining it across frames hands you a value that silently moves. The cache is why the no-arg form does not allocate: this runs per node per frame for culling and hit-testing.
Local ink extent - the union of the glyph quads, resolving a pending layout pass first. The resolve is not optional. Culling reads the local bounds BEFORE the renderer's collect phase gets a chance to call syncDirty, so a node that deferred its pass would be culled against the previous string's extent - and a label going from empty to non-empty would never appear at all. Reading is still cheap: with nothing pending this returns straight away, so no per-frame invalidation is introduced and a static subtree stays skippable.
Return the outward-facing edge normals used by the SAT solver. The array should be cached and reused across calls.
The node's TRUE world-space transform, composed through every transform-group boundary (RetainedContainer) in the ancestor chain. getGlobalTransform deliberately stops at the nearest engaged boundary (descendants resolve group-RELATIVE transforms; the renderer multiplies the group matrix back in on the GPU), so it is the right space for rendering but the wrong one for spatial queries. Use THIS accessor whenever a real world position/orientation is needed - picking, spatial audio, physics, world-space math against nodes outside the group. Without any engaged boundary ancestor it returns the exact getGlobalTransform matrix (same instance, no extra work). With one, it lazily caches groupLocal × groupWorld and revalidates on read via version/stamp compares - including runtime space flips such as RetainedContainer's deep-barrier sub-branch escape.
Test whether this shape overlaps target using a fast boolean algorithm (no penetration depth or normal computed). Prefer this over collidesWith when only the yes/no result is needed.
invalidateCache(): thisinvalidateContent(): thisMark this node's visual content dirty without going through a standard setter - e.g. a custom Drawable subclass backed by externally mutable data (the pattern TileChunkNode in @codexo/exojs-tilemap already uses via its own _chunk.revision compare). Call this after mutating such state so the Track-B retained-plan skip does not serve a stale frame for this node.
move(x: number, y: number): thisproject(axis: VectorConcrete mutable 2D vector with full AbstractVector arithmetic and Collidable collision support (treated as a point collider). `Vector.temp` provides a shared…, result: IntervalA closed scalar interval `[min, max]` used by the SAT collision solver to represent the projection of a shape onto a separating axis. `Interval.temp` provides…): IntervalA closed scalar interval `[min, max]` used by the SAT collision solver to represent the projection of a shape onto a separating axis. `Interval.temp` provides…Project this shape onto axis and write the scalar min/max into interval. Used internally by the SAT solver.
render(backend: RenderBackend): thisRaw rendering entry point. Direct backend access - bypasses the RenderPlan pipeline machinery. Prefer the high-level RenderingContext.render path via the owning RenderingContext wherever possible.
rotate(degrees: number): thissetAnchor(x: number, y: number): thisSet the normalized anchor and re-derive origin from it.
Change the blend mode. No-ops if the value is unchanged. Invalidates the render cache when the blend mode actually changes.
Replace the font and mark the geometry stale.
setLocalBounds(x: number, y: number, width: number, height: number): thisWrite this node's local extent and run the bounds invalidation the change implies - the node's own bounds flag, the ancestor bounds cascade, and the content-dirty stamp that keeps retained fragments from replaying the old extent. This is the only supported way to resize a node from outside getLocalBounds; the rectangle itself is handed out read-only so the invalidation cannot be forgotten. Built-in drawables (Sprite, Text, BitmapText, Mesh, ...) and custom ones alike go through here. Part of the renderer SDK contract for extension renderers.
setOrigin(x: number, y: number): thissetPosition(x: number, y: number): thissetRotation(degrees: number): thissetScale(x: number, y: number): thissetSkew(x: number, y: number): thisSet the tint colour by copying color into the internal Color instance. Invalidates the render cache so the change is picked up on the next frame. A retained product recognises a tint-only change and rewrites the affected row rather than re-recording, so tinting per frame stays cheap. Writing through the returned tint instance instead (sprite.tint.r = 8) bypasses that entirely and is not observed at all - assign a colour, or call RenderNode.invalidateContent after mutating in place.
syncDirty(): voidResolve a pending layout pass, if any, and apply it synchronously. The renderer calls this before each draw and every extent read resolves on its own, so manual calls are rarely needed.
updateBounds(): thisupdateParentTransform(): thisupdateTransform(): thismeasure(text: string, font: BmFontA loaded BMFont asset: the parsed descriptor plus all page textures. Loaded by the built-in BMFont factory - no extra setup required. Pass directly to BitmapTe…, options: BitmapTextOptions): TextSizeAdvance extent of a laid-out text string in pixels - where the cursor ends up, not how far the glyphs reach. See TextLayoutResult for the difference between th…Advance extent text would occupy in font under options, without constructing a node. Takes the same arguments as the constructor and gives the same answer as the resulting node's textBounds - it runs the identical layout pass against an adapter built the same way, so the two cannot drift. Unlike Text.measure this costs nothing beyond the layout itself: a BMFont atlas is pre-built, so there is no glyph to rasterize.
Properties45
cursor: null | stringdraggable: booleanWhen true and interactive is also true, this node will be automatically repositioned to follow the pointer during a drag gesture. The framework captures the pointer offset at drag-start so the node doesn't snap to the cursor position. Both interactive and draggable must be set for dragging to work - a draggable but non-interactive node will never receive pointerdown and therefore cannot start a drag.
focusable: booleanWhen true, this node can receive keyboard focus - via focus, Tab traversal, or app.interaction.focus(node) - and is delivered key events through onKeyDown / onKeyUp while focused, or while any of its descendants holds focus (key events bubble up the parent chain like pointer InteractionEvents do). A Widget additionally has to be enabled: disabling one takes it out of the Tab order and rejects programmatic focus, without touching this flag.
Optional pick shape in this node's LOCAL space, replacing the bounds test contains would otherwise perform. Defaults to null. The world-space point is mapped through the inverse of the node's global transform before the shape is tested, so the region follows the node's position, rotation, scale and skew like the rendered output does - the shape itself is never re-transformed and never needs updating when the node moves. Affects picking only. Bounds, culling and rendering ignore it entirely, and because the interaction system finds candidates by their bounds, a hit area reaching outside the node's bounds is only reliably picked where the two overlap. Use it to shrink or reshape a pick region, not to grow one. The shape is the caller's: it is read live on every hit test, so mutating it in place takes effect immediately, and the node never destroys it.
name: null | stringOptional human-readable identity for this node. Defaults to null. Purely a label the engine never interprets: useful for debugging, find-by-name lookups, prefab references, and as a stable key when merging serialized state back onto an existing tree. Not required to be unique.
tabIndex: numberTab-traversal order among focusable nodes in the same focus scope. Lower values are visited first; equal values keep document (tree) order.
Normalized anchor in 0..1 along each axis that derives origin from this drawable's layout box. (0, 0) = top-left, (0.5, 0.5) = centre, (1, 1) = bottom-right. Updates origin whenever the anchor or the layout box changes. The mapping is a pure function of the anchor and the box size - the same anchor value always yields the same origin, whatever it was set to before - so (0, 0), the default, always means origin = (0, 0). Set origin directly instead when the pivot is not a fraction of the box.
cacheAsTexture: booleanBake this node's subtree into a RenderTexture once and replay that texture until the subtree changes, instead of walking and drawing it every frame. Worth it for a subtree that is expensive to draw and rarely changes. The cache is invalidated by anything that moves the node's world bounds - the node's own transform included - so a node that animates re-bakes every frame and is strictly slower than not caching it at all. Setting it to false frees the texture immediately.
cacheResolution: TargetResolutionResolution the cacheAsTexture texture is baked at, in device pixels per logical unit. 'inherit' (the default) matches the surface the cache is composited into, so enabling the cache does not soften the picture on a HiDPI display. Pin it to a number to trade sharpness for memory and bake cost - a cache is resolution² texels, so 1 on a DPR-3 phone is a ninth of the VRAM and a ninth of the fill per re-bake. Changing it invalidates the cache.
clip: booleanWhen true, descendants are geometrically clipped to clipShape. Unlike mask (which is alpha/visibility masking), clip is a hard geometric boundary: - clipShape === null - clip to this node's world-space bounds (getBounds), using the GPU scissor fast path. - clipShape is a Rectangle - clip to that world-space rectangle via scissor. - clipShape is a Geometry - clip to the geometry's silhouette via the stencil buffer (WebGL2). Only fragments inside the shape survive. Clipping wraps the node's final (filtered/masked) output and acts as a render barrier: draw commands are never reordered or batched across the clip boundary.
clipShape: GeometryNon-renderable geometry data object used by advanced rendering paths. Geometry owns only vertex/index data and its layout metadata; it is not a scene node, has… | RectangleMutable axis-aligned rectangle defined by a top-left origin `(x, y)` and dimensions `(width, height)`. Implements Collidable with full SAT collision response f… | nullClip region used when clip is true. A Rectangle (or null for the node's bounds) maps to the scissor fast path; a Geometry maps to the stencil path. Has no effect while clip is false.
cullable: booleanWhen false, this node is never culled by the viewport check and is always considered in-view. Defaults to true.
Custom rectangle used for viewport cull intersection test. When set, replaces the default node bounds in cull checks. Set to null to restore default bounds-based culling.
destroyed: booleantrue once destroy has run on this node. A destroyed node has released its pooled resources (transform/bounds), has been unlinked from its parent, renders nothing, and must not be reused or re-attached. The render plan skips a destroyed node, so even one handed straight to a renderer as a detached root contributes nothing.
The BmFont this text renders from. Replace via setFont.
fontScale: numberScale factor applied to all glyph metrics from the font descriptor.
interactive: booleanisAlignedBox: booleanFlow-control options - maxWidth, letterSpacing, whiteSpace etc. Handed out read-only: the node holds its own copy, so mutating the object would change nothing. Assign a new one to re-flow. Carries layout keys only. A subclass whose options bag merges style and layout into one flat object (as TextOptions does) still reports just the layout half here.
The mask source that controls visibility of this node's render output. See MaskSource for accepted source types and their semantics. Setting to null removes any active mask. Setting a RenderNode that is this is rejected (a node cannot mask itself). Indirect cycles (a.mask = b; b.mask = a) are rejected as well: the candidate's mask chain is walked and any cycle - whether it closes on this or was already present in the chain - fails the assignment.
msdf: booleantrue when the atlas was produced by msdf-atlas-gen.
Per-page quad data consumed by the text renderer. Resolves a pending layout pass first, so a reader never sees the previous string's geometry.
Render-only pixel-snapping policy for this drawable. Aligns the rendered origin (PixelSnapMode.Position) or origin plus shared geometry boundaries (PixelSnapMode.Geometry) to the active render target's device-pixel grid. Purely visual: logical x/y, transforms, bounds, collision, tween and physics state are never affected, and getBounds/getGlobalTransform keep returning logical values. PixelSnapMode.Geometry is guaranteed only for axis-aligned transforms; rotation or skew (on this node, an ancestor, or the view) downgrade it to PixelSnapMode.Position for the affected frame, with no logical-state change. Snapping targets device pixels (× view scale × pixel ratio), not integer world units. Setting the current value is a no-op. Setting a value outside the PixelSnapMode enum throws and leaves the prior mode unchanged.
preserveDrawOrder: booleanWhen true, material-aware overlap reordering is disabled for this node's draw-order scope. Draw commands are submitted in exact document order (after scope-local z-sorting), preserving the painter's guarantee irrespective of material compatibility or AABB safety analysis. Adjacency coalescing of consecutive same-material draws still applies; it does not change visual output order.
rasterPixelRatio: numberDevice pixels per logical pixel this node's glyphs are rasterized at. 1 for everything whose glyph source is fixed at build time - a BitmapText draws from an atlas somebody else already rasterized, and whatever density that atlas was built at is baked into its own metrics. Text overrides this with the density it resolved for the surface it is drawn on. The renderers read it to convert style lengths that are expressed in logical pixels but applied in atlas texels - the shadow offset is the only one today.
rotation: numberRotation angle in degrees. Wraps via trimRotation on assignment.
skewX: numberHorizontal skew angle in degrees. Shears the node along the X axis (positive values lean the top edge right). Combines correctly with rotation and scale.
skewY: numberVertical skew angle in degrees. Shears the node along the Y axis (positive values lean the left edge downward). Combines correctly with rotation and scale.
Visual style - align, leading, fillColor, outlineColor etc.
text: stringThe string currently displayed by this node.
Advance extent of the laid-out text - where the cursor ends up, which is the number to size a panel or place a caret against. This is NOT the rectangle the glyphs cover: SDF padding, outlines and shadows all reach past it, and in SDF mode the ink even starts at a negative coordinate. getLocalBounds returns that ink extent, and it is what culling, hit-testing and the gradient box use. Resolves a pending layout pass before answering.
The page textures this node draws from.
visible: booleanx: numbery: numberzIndex: numberEvents14
onBlur: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[RenderNodeSceneNode that can produce visual output. Adds the rendering pipeline features on top of the structural transform/bounds carried by SceneNode: post-process `fi…]>Fired when this node loses keyboard focus.
onContextMenu: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>Fired when a pointer requests a context menu over this node - right-click, or a long-press/touch gesture that has an attributable pointer. Bubbles like the other pointer events, so a scene-wide fallback can listen on an ancestor. Carries no native event - whether the browser's own menu appears is decided by ApplicationOptions.input.allowNativeContextMenu, independently of this. Requires an attributable pointer: a pointerless keyboard-only request (the context-menu key, or Shift+F10, with no pointer ever having touched the surface - see ContextMenuRequest's doc comment) has nothing to hit-test or bubble with, so it never reaches this per-node event. It only ever reaches the engine-wide, scene-graph-independent app.input.onContextMenu.
onDrag: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>Fired on every pointer-move while this node is being dragged. Does not bubble.
onDragEnd: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>Fired when the drag gesture ends (pointer-up or cancel). Does not bubble.
onDragStart: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>Fired once when a drag gesture begins on this node. Does not bubble.
onFocus: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[RenderNodeSceneNode that can produce visual output. Adds the rendering pipeline features on top of the structural transform/bounds carried by SceneNode: post-process `fi…]>Fired when this node gains keyboard focus.
onKeyDown: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[KeyEventEnvelope dispatched by `app.interaction` to the focused RenderNode for keyboard input, then bubbled up its entire parent chain - same DOM-style shape as Intera…]>Fired for each key pressed while this node - or a descendant of it - holds focus. Bubbles; see KeyEvent.
onKeyUp: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[KeyEventEnvelope dispatched by `app.interaction` to the focused RenderNode for keyboard input, then bubbled up its entire parent chain - same DOM-style shape as Intera…]>Fired for each key released while this node - or a descendant of it - holds focus. Bubbles; see KeyEvent.
onPointerDown: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>onPointerMove: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>onPointerOut: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>onPointerOver: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>onPointerTap: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>onPointerUp: SignalLightweight typed event emitter. Each `Signal` represents one named notification channel (e.g. `onResize`, `onFrame`). Listeners are added with Signal.add or S…<[InteractionEventDOM-Event-shaped envelope dispatched by InteractionSystem to interactive scene nodes. Bubbles up the *entire* parent chain - `target` stays pinned to the hit-d…]>Source