Canvas, paint, path, and vector

Canvas gives a painter a local Size and mutable PaintContext during retained painting.

Draw in local coordinates

Canvas([](PaintContext& paint, Size size) {
  paint.DrawCircle(
      {size.width / 2.0F, size.height / 2.0F},
      36.0F,
      Color::Rgb(92, 61, 180)
  );
}).With(Frame{.width = 160.0F, .height = 160.0F})

The canvas rectangle is always local (0, 0, size.width, size.height). Padding and parent placement are resolved before the painter runs, so drawing code does not need the node’s world position.

Append paint commands

Paint operations append immutable platform-neutral commands. Available primitives cover rectangles, linear/radial gradients, text and text runs, raster/vector images, external textures, circles, arcs, borders, shadows, filled/stroked paths, clips, and transforms.

Use DrawText for one text layout and DrawTextRuns when a caller already owns several measured runs with different styles. The platform renderer consumes the supplied layout geometry; custom paint code should not create a second platform-specific measurement path.

Use DrawImage or DrawImageRect after resolving an ImageAsset with UseImage. Normal UI should prefer Image(resource), which owns resource resolution, fitting, tint, and semantics.

Build paths and vectors

Path builds line, curve, arc, and closed contours with a fill rule. VectorBuilder combines paths into a reusable VectorAsset. Prefer Image(VectorAsset) for reusable icons and Canvas for size-dependent or animated custom drawing.

Stroke width, joins, caps, and path geometry remain platform-neutral. Build stable vector assets outside a per-frame painter when the same geometry is reused.

Balance paint state

Balance every pushed clip or transform. Paint commands use local coordinates; runtime composition supplies node transforms and opacity. Custom drawing does not automatically add semantics, so attach Semantics when the result communicates information. See Paint API and Vector API.