API reference
Every public class, method, and event in @codexo/exojs. Generated from source.
classText
GPU-accelerated text node that rasterizes individual glyphs into a shared per-font-variant GlyphAtlas using the SDF (Signed Distance Field) technique and renders them through the `text-sdf` shader. Style mutations are applied automatically before the next draw - nothing has to be ticked by hand. Mutating `text.style` any number of times in the same frame is cheap; the geometry is rebuilt at most once, on demand. ```ts const label = new Text('Hello', { fontSize: 24 }); scene.addChild(label); label.style.fillColor = new Color(255, 0, 0); // cheap - no atlas work label.style.outlineWidth = 0.08; // cheap - only shader uniforms // changes are picked up automatically on the next render pass ``` **FontFace-first:** load fonts via FontFactory before constructing the node, then pass the loaded `FontFace` via the `font` style option. The label renders immediately with the correct glyphs - no async waiting needed. ```ts const face = await loader.load(Asset.type('font', 'roboto.woff2', { family: 'Roboto' })); const label = new Text('Score: 0', { font: face, fontSize: 24 }); scene.addChild(label); // renders immediately with Roboto ``` Enable colour-glyph (emoji) mode via `colorGlyphs: true` in the constructor options. Colour-glyph nodes use the `text-color` shader instead of `text-sdf`. Glyphs are rasterized at the Application's `pixelRatio`, so text is crisp on a HiDPI surface without any opt-in. TextOptions.pixelRatio decouples one node's glyph raster from the surface without changing its layout by so much as a line break.
import { Text } from '@codexo/exojs'GPU-accelerated text node that rasterizes individual glyphs into a shared per-font-variant GlyphAtlas using the SDF (Signed Distance Field) technique and renders them through the `text-sdf` shader.
Style mutations are applied automatically before the next draw - nothing has to be ticked by hand. Mutating `text.style` any number of times in the same frame is cheap; the geometry is rebuilt at most once, on demand.
```ts const label = new Text('Hello', { fontSize: 24 }); scene.addChild(label);
label.style.fillColor = new Color(255, 0, 0); // cheap - no atlas work label.style.outlineWidth = 0.08; // cheap - only shader uniforms // changes are picked up automatically on the next render pass ```
**FontFace-first:** load fonts via FontFactory before constructing the node, then pass the loaded `FontFace` via the `font` style option. The label renders immediately with the correct glyphs - no async waiting needed.
```ts const face = await loader.load(Asset.type('font', 'roboto.woff2', { family: 'Roboto' })); const label = new Text('Score: 0', { font: face, fontSize: 24 }); scene.addChild(label); // renders immediately with Roboto ```
Enable colour-glyph (emoji) mode via `colorGlyphs: true` in the constructor options. Colour-glyph nodes use the `text-color` shader instead of `text-sdf`.
Glyphs are rasterized at the Application's `pixelRatio`, so text is crisp on a HiDPI surface without any opt-in. TextOptions.pixelRatio decouples one node's glyph raster from the surface without changing its layout by so much as a line break.
_replaceStyle(style: TextStyleText styling options carried by a TextObject.): void_runLayout(hint: StyleChangeHintDescribes how costly a style change is to incorporate. Hints accumulate to the heaviest pending change: `tint` < `layout` < `font`): TextLayoutResultResult of a full text layout pass: quad placements plus both extents. Text has two honest sizes and they are not interchangeable. The advance is what a layout…_updateOrigin(): voidblur(): thisclearFilters(): thiscollect(builder: RenderPlanBuilder, seq?: number): voidcollidesWith(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… | nullcontains(x: number, y: number): booleandestroy(): voidfocus(): thisgetBounds(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…invalidateCache(): thisinvalidateContent(): thismove(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…render(backend: RenderBackend): thisrotate(degrees: number): thissetAnchor(x: number, y: number): thissetLocalBounds(x: number, y: number, width: number, height: number): thissetOrigin(x: number, y: number): thissetPosition(x: number, y: number): thissetRotation(degrees: number): thissetScale(x: number, y: number): thissetSkew(x: number, y: number): thissyncDirty(): voidupdateBounds(): thisupdateParentTransform(): thisupdateTransform(): thismeasure(text: string, options: TextOptionsConstruction options for a Text node - a flat merge of visual TextStyleOptions (appearance) and LayoutOptions (flow / overflow), plus two construction-only fla…): 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…cursor: null | stringdraggable: booleanfocusable: booleanname: null | stringtabIndex: numbercacheAsTexture: booleancacheResolution: TargetResolutionclip: booleanclipShape: 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… | nullcolorGlyphs: booleancullable: booleandestroyed: booleaninteractive: booleanisAlignedBox: booleanpixelRatio: number | undefinedpreserveDrawOrder: booleanrasterPixelRatio: numberrotation: numbersdfRadius: numberskewX: numberskewY: numbertext: stringvisible: booleanx: numbery: numberzIndex: numberonBlur: 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…]>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…]>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…]>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…]>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…]>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…]>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…]>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…]>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…]>