Mob.Canvas (mob v0.6.2)

Drawing-op constructors for Mob.UI.canvas/1.

Each function returns a plain map describing one draw operation. The canvas widget takes a :draw list of these and renders them in order. Color values can be theme tokens (e.g. :primary, :on_surface) or raw strings ("#ff0000") — they are resolved by Mob.Renderer against the active theme before serialisation to the native side.

All coordinates are canvas-local in points/dp, top-left origin (matches SwiftUI Canvas and Jetpack Compose Canvas natively, no translation cost).

Op map equivalence

Helpers and raw maps produce identical output. These are the same:

Mob.Canvas.line(0, 0, 100, 100, color: :primary, width: 4)
%{op: :line, x1: 0, y1: 0, x2: 100, y2: 100, color: :primary, width: 4}

Use whichever you prefer; the renderer doesn't care.

Available ops

line/5 — straight stroke between two points
circle/4 — circle (outline or filled)
ellipse/5 — ellipse with separate rx, ry
arc/6 — circular arc between two angles in degrees
rect/5 — rectangle (outline or filled, optional corner radius)
path/2 — sequence of points (open or closed; outline or filled)
text/4 — text at a point with anchor
image/5 — image from an asset name into a rect

Common modifiers (accepted on every op where they make sense)

:opacity — float 0.0–1.0
:width — stroke width in points/dp (ignored on filled-only ops)
:dash — list of [on, off] floats for dashed strokes, e.g. [4, 4]
:cap — :butt | :round | :square (line/arc/path)
:join — :miter | :round | :bevel (path/rect outline)
:fill — boolean (circle/ellipse/rect/path); default false (stroke)

Text-specific

:weight — :thin | :light | :regular | :medium | :semibold | :bold
:family — string font family name; platform default if omitted
:anchor — :start | :center | :end (horizontal); default :start

Summary

Functions

arc(x, y, r, start_deg, end_deg, opts \\ [])

Draw a circular arc centered at (x, y), radius r, from start_deg sweeping clockwise to end_deg. 0° points to the right, 90° points down (matching SwiftUI / Compose conventions).

circle(x, y, r, opts \\ [])

Draw a circle. Defaults to stroke; pass fill: true for a filled disc.

ellipse(x, y, rx, ry, opts \\ [])

Draw an ellipse with separate horizontal and vertical radii.

image(x, y, w, h, source, opts \\ [])

Draw an image into the rect at (x, y, w, h). source is an asset name resolved by the platform (e.g. an iOS asset catalog name or Android drawable name).

line(x1, y1, x2, y2, opts \\ [])

Stroke a line from (x1, y1) to (x2, y2).

path(points, opts \\ [])

Draw a path through a list of points. Points are 2-element lists or 2-tuples; tuples are normalised to lists for JSON serialisation.

rect(x, y, w, h, opts \\ [])

Draw a rectangle. Defaults to stroke; pass fill: true for filled. radius: rounds the corners (single value, all four corners).

text(x, y, content, opts \\ [])

Draw text at (x, y). The anchor controls horizontal alignment of the text relative to x; vertical baseline is ascender (text grows downward from y, matching SwiftUI/Compose Canvas defaults).