Files
prosperon/docs/api/modules/draw2d.md
2026-02-24 21:08:46 -06:00

2.7 KiB

title, type
title type
draw2d docs

draw2d

A collection of retained-mode 2D drawing factories. Each factory creates an object that auto-registers with film2d and renders via the compositor. Destroy objects when no longer needed.

var draw = use('draw2d')

Factories

draw.sprite(props)

Create a sprite from an image. Auto-registers with film2d.

var s = draw.sprite({
  image: "hero.png",
  pos: {x: 100, y: 200},
  width: 32, height: 32,
  plane: 'game', layer: 0
})
s.destroy()  // remove from renderer

See sprite.cm for full property list: pos, image, width, height, anchor_x, anchor_y, rotation, color, opacity, tint, filter, plane, layer, groups, visible, flip, fit, uv.

draw.shape.rect(props) / circle(props) / ellipse(props) / pill(props)

Create SDF shapes. Supports fill, stroke, rounded corners, dashing, feathering, and texture fill.

var box = draw.shape.rect({
  pos: {x: 50, y: 50}, width: 100, height: 60,
  fill: {r: 1, g: 0, b: 0, a: 1},
  stroke: {r: 1, g: 1, b: 1, a: 1}, stroke_thickness: 2,
  radius: 8,
  plane: 'game'
})

var ball = draw.shape.circle({
  pos: {x: 200, y: 200}, radius: 16,
  fill: {r: 0, g: 1, b: 0, a: 1},
  plane: 'game', groups: ['glow']
})

Properties: shape_type, pos, width, height, radius, corner_style, feather, stroke_thickness, stroke_align, dash_len, gap_len, dash_offset, cap, join, fill, stroke, blend, opacity, fill_tex, uv, plane, layer, groups, visible.

draw.text(props)

Create a text label. Updates live when you change .text.

var label = draw.text({
  text: "Score: 0",
  pos: {x: 10, y: 500},
  font: "fonts/dos", size: 16,
  color: {r: 1, g: 1, b: 1, a: 1},
  plane: 'hud'
})
label.text = "Score: 42"  // updates on next frame

draw.tilemap(props)

Create a tile-based map. See tilemap2d.cm.

draw.anim(props)

Create an animated sprite from an aseprite/gif file. Auto-plays if the image has frames.

var anim = draw.anim({
  image: "hero.aseprite",
  pos: {x: 100, y: 100},
  plane: 'game'
})
anim.play("walk")   // play named animation
anim.stop()         // pause
anim.resume()       // resume
anim.update(dt)     // advance frame (call from update loop)

Lifecycle

All draw2d objects register with film2d on creation. Call .destroy() to unregister and remove from rendering. Set .visible = false to hide without destroying.

Planes and Groups

Every drawable has a plane (string) and optional groups (array of strings). The compositor renders drawables per-plane. Groups route drawables through effects (bloom, mask, etc.).