# `Plushie.Canvas.Element`
[🔗](https://github.com/plushie-ui/plushie-elixir/blob/v0.7.2/lib/plushie/canvas/element.ex#L1)

Behaviour for canvas elements.

Canvas elements are the building blocks of canvas drawing. Like
widgets, they produce tree nodes, but they operate in the canvas
domain: positioned by coordinates rather than layout, drawn by
the canvas renderer rather than the widget renderer.

## Declaring an element

    defmodule MyApp.Canvas.Star do
      use Plushie.Canvas.Element

      element :star do
        field :x, :float
        field :y, :float
        field :radius, :float
        field :points, :integer, default: 5
        field :fill, Plushie.Type.Color
      end
    end

## Generated code

The macro generates:

- `new/1` auto-ID constructor (`new(opts)`) for use inside
  canvas blocks where the container assigns IDs automatically
- `new/2` constructor with explicit ID (`new(id, opts)`)
- Setter functions per field for pipeline composition
- `with_options/2` for applying keyword options via setters
- `build/1` for explicit `ui_node()` conversion
- `type_name/0` returning the element type string
- `encode/1` for backward compatibility with `Plushie.Type.encode_value`
- `@type t`, `@type option` typespecs
- `Plushie.Tree.Node` protocol implementation

## Container elements

Pass `container: true` for group-like elements that hold children:

    element :group, container: true do
      field :opacity, :float
    end

Container elements get `push/2` and `extend/2` for adding children,
and `new/2` accepts a `:do` option for inline children.

---

*Consult [api-reference.md](api-reference.md) for complete listing*