Canvas for drawing shapes, organized into named layers.
Canvas is a container widget. Its children are Plushie.Canvas.Layer
elements, each holding shape children. Each layer maps to an iced
Cache on the Rust side; only changed layers are re-tessellated.
Props
| Name | Type | Default | Description |
|---|---|---|---|
width | :fill | :shrink | {:fill_portion, pos_integer()} | number() | nil | Canvas width. Default: fill. |
height | :fill | :shrink | {:fill_portion, pos_integer()} | number() | nil | Canvas height. Default: 200px. |
background | String.t() | nil | Canvas background color. |
interactive | boolean() | nil | Enable all mouse event handlers. Default: false. |
on_press | boolean() | nil | Enable mouse press events. Default: false. |
on_release | boolean() | nil | Enable mouse release events. Default: false. |
on_move | boolean() | nil | Enable mouse move events. Default: false. |
on_scroll | boolean() | nil | Enable mouse scroll events. Default: false. |
alt | String.t() | atom() | nil | Accessible label for the canvas. |
description | String.t() | atom() | nil | Extended accessible description. |
role | String.t() | atom() | nil | Accessible role (e.g. "radiogroup", "toolbar"). |
arrow_mode | :wrap | :clamp | :linear | :none | nil | Arrow key navigation mode: :wrap, :clamp, :linear, :none. |
event_rate | integer() | nil | Max events per second for coalescable events. |
a11y | %Plushie.Type.A11y{} | map() | keyword() | %{role: :canvas} | Accessibility annotations. |
Summary
Functions
Accessibility annotations.
Accessible label for the canvas.
Arrow key navigation mode: :wrap, :clamp, :linear, :none.
Canvas background color.
Converts this widget struct to a ui_node() map.
Creates a :canvas widget.
Extended accessible description.
Max events per second for coalescable events.
Appends multiple children to the widget.
Canvas height. Default: 200px.
Enable all mouse event handlers. Default: false.
Creates a new widget struct with the given ID and keyword options.
Enable mouse move events. Default: false.
Enable mouse press events. Default: false.
Enable mouse release events. Default: false.
Enable mouse scroll events. Default: false.
Appends a child to the widget.
Accessible role (e.g. "radiogroup", "toolbar").
Canvas width. Default: fill.
Applies keyword options to an existing widget struct.
Types
@type option() :: (((((((((((({:width, :fill | :shrink | {:fill_portion, pos_integer()} | number()} | {:height, :fill | :shrink | {:fill_portion, pos_integer()} | number()}) | {:background, atom() | String.t() | map()}) | {:interactive, boolean()}) | {:on_press, boolean()}) | {:on_release, boolean()}) | {:on_move, boolean()}) | {:on_scroll, boolean()}) | {:alt, String.t() | atom()}) | {:description, String.t() | atom()}) | {:role, String.t() | atom()}) | {:arrow_mode, :wrap | :clamp | :linear | :none}) | {:event_rate, integer()}) | {:a11y, %Plushie.Type.A11y{ active_descendant: term(), busy: term(), described_by: term(), description: term(), disabled: term(), error_message: term(), expanded: term(), has_popup: term(), hidden: term(), invalid: term(), label: term(), label_from: term(), labelled_by: term(), level: term(), live: term(), mnemonic: term(), modal: term(), orientation: term(), position_in_set: term(), radio_group: term(), read_only: term(), required: term(), role: term(), selected: term(), size_of_set: term(), toggled: term(), value: term() } | map() | keyword()}
@type t() :: %Plushie.Widget.Canvas{ a11y: (%Plushie.Type.A11y{ active_descendant: term(), busy: term(), described_by: term(), description: term(), disabled: term(), error_message: term(), expanded: term(), has_popup: term(), hidden: term(), invalid: term(), label: term(), label_from: term(), labelled_by: term(), level: term(), live: term(), mnemonic: term(), modal: term(), orientation: term(), position_in_set: term(), radio_group: term(), read_only: term(), required: term(), role: term(), selected: term(), size_of_set: term(), toggled: term(), value: term() } | map() | keyword()) | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, alt: (String.t() | atom()) | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, arrow_mode: (:wrap | :clamp | :linear | :none) | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, background: String.t() | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, children: [Plushie.Widget.ui_node()], description: (String.t() | atom()) | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, event_rate: integer() | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, height: (:fill | :shrink | {:fill_portion, pos_integer()} | number()) | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, id: String.t(), interactive: boolean() | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, on_move: boolean() | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, on_press: boolean() | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, on_release: boolean() | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, on_scroll: boolean() | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, role: (String.t() | atom()) | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil, width: (:fill | :shrink | {:fill_portion, pos_integer()} | number()) | Plushie.Animation.Transition.t() | Plushie.Animation.Spring.t() | Plushie.Animation.Sequence.t() | nil }
Functions
@spec a11y( widget :: t(), value :: (%Plushie.Type.A11y{ active_descendant: term(), busy: term(), described_by: term(), description: term(), disabled: term(), error_message: term(), expanded: term(), has_popup: term(), hidden: term(), invalid: term(), label: term(), label_from: term(), labelled_by: term(), level: term(), live: term(), mnemonic: term(), modal: term(), orientation: term(), position_in_set: term(), radio_group: term(), read_only: term(), required: term(), role: term(), selected: term(), size_of_set: term(), toggled: term(), value: term() } | map() | keyword()) | nil ) :: t()
Accessibility annotations.
Accepts %Plushie.Type.A11y{} | map() | keyword().
Accessible label for the canvas.
Accepts String.t() | atom().
Arrow key navigation mode: :wrap, :clamp, :linear, :none.
Accepts :wrap | :clamp | :linear | :none.
Canvas background color.
Accepts String.t().
@spec build(widget :: t()) :: Plushie.Widget.ui_node()
Converts this widget struct to a ui_node() map.
Creates a :canvas widget.
Shorthand for new/2. Import this macro to use the widget name
directly in view functions:
import Plushie.Widget.Canvas, only: [canvas: 2]
canvas("my-id", prop: value)
Extended accessible description.
Accepts String.t() | atom().
Max events per second for coalescable events.
Accepts integer().
@spec extend(widget :: t(), children :: [Plushie.Widget.child()]) :: t()
Appends multiple children to the widget.
@spec height( widget :: t(), value :: (:fill | :shrink | {:fill_portion, pos_integer()} | number()) | nil ) :: t()
Canvas height. Default: 200px.
Accepts :fill | :shrink | {:fill_portion, pos_integer()} | number().
Enable all mouse event handlers. Default: false.
Accepts boolean().
Creates a new widget struct with the given ID and keyword options.
Enable mouse move events. Default: false.
Accepts boolean().
Enable mouse press events. Default: false.
Accepts boolean().
Enable mouse release events. Default: false.
Accepts boolean().
Enable mouse scroll events. Default: false.
Accepts boolean().
@spec push(widget :: t(), child :: Plushie.Widget.child()) :: t()
Appends a child to the widget.
Accessible role (e.g. "radiogroup", "toolbar").
Accepts String.t() | atom().
@spec width( widget :: t(), value :: (:fill | :shrink | {:fill_portion, pos_integer()} | number()) | nil ) :: t()
Canvas width. Default: fill.
Accepts :fill | :shrink | {:fill_portion, pos_integer()} | number().
Applies keyword options to an existing widget struct.