Engine Components
There are some built-in components available to be used alongside custom components when spawning and querying.
Transform
The Transform component defines location information in 2D space for an entity. When rendering entities to the screen, the transform is used for understanding the translation, rotation, and size.
type Transform = Component<{
position: Vec3;
scale: Vec2;
skew: Vec2;
pivot: Vec2;
rotation: f32
}>
- Position: Sometimes called the
translation
. Thex
andy
are used for placement, andz
is used for ordering behind or in front of other entities. - Scale: The size of the entity - a bigger scale will result in a bigger rendered size.
- Rotation: The amount in radians that the entity is rotated. Use
deg2rad()
to use degrees instead of radians. - Skew: Not implemented yet.
- Pivot: Not implemented yet.
EntityId
The EntityId component is automatically attached to every spawned entity. It contains the unique numeric id
of the entity, which can be used for despawning, setting labels, parenting, and more.
type EntityId = Component<{ id: u64 }>
TextureRender
The TextureRender component is used during spawning to attach a specific texture image to an entity. The textureId
is retrieved when loading a texture, and the visible
field determinds if the texture is rendered.
type TextureRender = Component<{ textureId: TextureId; visible: boolean }>
TextRender
The TextRender component is used during spawning to attach some text to an entity. Right now the text must be less than 256 bytes in size.
type TextRender = Component<{
bounds: Vec2
fontSize: f32
alignment: TextAlignment
text: Text<256>
visible: boolean
}>
Color & ColorRender
There are two components related to coloring entities. The first is Color, which take four r/g/b/a values between 0-1. The second is the ColorRender component which can also be thought of as a rectangle render. ColorRender is optional if using other render components such as TextureRender or CircleRender.
type Color = Component<{ r: number, g: number, b: number, a: number }>
type ColorRender = Component<{ visible: boolean }>
CircleRender
CircleRender is for rendering a circle to the screen. The sides
is used for determining how smooth the circle will look. For example, a sides
of 3
would render a triangle, and 8 an octogon.
type CircleRender = Component<{ sides: u32; visible: boolean }>
LocalToWorld
When querying, provides a matrix of the entity that can be used during calculations for converting vectors into different coordinate spaces. Best used with the Coords
functions, such as Coords.localToWorld(...)
.
type LocalToWorld = Component<{ matrix: Mat4 }>
Camera
type Camera = Component<{
view: Mat4
projection: Mat4
clearColor: Color
viewportRatio: Viewport
aspectRatioOverride: f32 | undefined
renderTargetTextureId: u32 | undefined
orthographicSize: f32
renderOrder: i32
isEnabled: boolean
}>