documentation/js/js_gui__widget.md
Displays a combination of custom elements on one screen.
let eventLoop = require("event_loop");
let gui = require("gui");
let widgetView = require("gui/widget");
This module depends on the gui module, which in turn depends on the
event_loop module, so they must be imported in this order. It is also
recommended to conceptualize these modules first before using this one.
For an example, refer to the gui.js example script.
This view does not have any props.
This view has the elements as its children.
Elements are objects with properties to define them, in the form { element: "type", ...properties } (e.g. { element: "button", button: "right", text: "Back" }).
| Element Type | Properties | Description |
|---|---|---|
string_multiline | x (number), y (number) | |
align (("t", "c", "b") + ("l", "m", "r")) | ||
font ("primary", "secondary", "keyboard", "big_numbers") | ||
text (string) | String of text that can span multiple lines. | |
string | x (number), y (number) | |
align (("t", "c", "b") + ("l", "m", "r")) | ||
font ("primary", "secondary", "keyboard", "big_numbers") | ||
text (string) | String of text. | |
text_box | x (number), y (number) | |
w (number), h (number) | ||
align (("t", "c", "b") + ("l", "m", "r")) | ||
text (string) | ||
stripToDots (boolean) | Box of with text that can be scrolled vertically. | |
text_scroll | x (number), y (number) | |
w (number), h (number) | ||
text (string) | Text that can be scrolled vertically. | |
button | text (string) | |
button ("left", "center", "right") | Button at the bottom of the screen. | |
icon | x (number), y (number) | |
iconData (IconData) | Display an icon. | |
rect | x (number), y (number) | |
w (number), h (number) | ||
radius (number), fill (boolean) | Draw a rectangle, optionally rounded and filled. | |
circle | x (number), y (number) | |
radius (number), fill (boolean) | Draw a circle, optionally filled. | |
line | x1 (number), y1 (number) | |
x2 (number), y2 (number) | Draw a line between 2 points. |
Button event information structure.
Fields
"left" | "center" | "right")"press" | "release" | "short" | "long" | "repeat")| Item | Type | Description |
|---|---|---|
button | ButtonEvent | Fires when the user presses on one of the three possible buttons if there's a corresponding button element. Refer to the ButtonEvent structure above for possible values. |