dopesheet
block
Animated sprite-sheet playback: plays a range of frames cropped from a sheet at a set fps, a placeable diagram shape.
dopesheet plays a range of frames from a sprite sheet at a set fps. Like tilemap it's a placeable SVG block — a legal child of any diagram or container. The sheet is referenced by URL (an @inline(0) source, like image), so frames resolve when the site is served, not when the page is opened directly from disk.
Frame geometry and playback
Describe the frame grid with frame_width / frame_height, plus offset_x / offset_y and stride_x / stride_y for padding or gaps; columns defaults to as many frames as fit across the sheet. from / to pick an inclusive sub-range. scale enlarges pixel art; image-rendering: pixelated is the default, so set smooth = true for non-pixel sources. Autoplay, loop, and controls are on by default — click to pause or resume.
diagram { width = 96 height = 96
dopesheet "assets/pixel-coin.png" {
frame_width = 12
frame_height = 12
stride_x = 12
stride_y = 12
columns = 6
from = 0
to = 2
fps = 6.0
autoplay = false
scale = 6.0
x = 12.0
y = 12.0
}
}
Related
- image
- diagram