The Canvas component is a container for drawing graphics, and manipulating images via JavaScript. Once the component is on the page, use JavaScript to create content within the canvas.

More information can be found on the Umajin Developer site: Canvas Component

Properties for the Canvas Component

NameWhen components are placed on a page they appear highlighted blue in the scene tree and can be renamed by double clicking in this panel and typing the new name. Components can also be set to be visible/invisible on the page, using the ‘eye’ icon on this panel.
Position and Size

Sets position and size.

As long as measurements are maintained as percentages it deals automatically with dynamic layout and resizing for different devices and orientations.

You can use millimeters to control aspects of size like width or height in order to create a Canvas component that’s size will be maintained across devices.




ImageAn image loaded onto the canvas (optional)
Fill colorType in the hex number or use the color panel to select the color you want.
OpacityThe opacity slider sets the transparency of the canvas. 100 is maximum opacity.
Pixel widthWidth of the image buffer.
Pixel heightHeight of the image buffer.
Resize ModeStretch (default) – stretches the canvas to the size of the component on the page.
Fit – fits the canvas, with the aspect ratio from Pixel width and Pixel Height, into the available space within the component on the page.

Events that can Trigger an Action on the Canvas Component

On Up
On Press
On Down
On Move