Button
Check out the standard help for an overview of the button component.
API Examples
// Internally the component is known as "button"
var buttonComponent1 = findComponent("My Page", "button", "MyButton"); // To retrieve a button component called "MyButton" on a page called "My Page"
var buttonComponent2 = findComponentInForeground("My Foreground", "button", "MyButton"); // To retrieve a button component in the foreground.
var buttonComponent3 = createComponent(parentComponent, "button", 0, 0, 100, 100); // to create a button component inside a custom component.
// Retrieving a property
var textOnButton = getProperty(buttonComponent1, "text");
console.log(textOnButton);
// Setting a property
setProperty(buttonComponent1, "text", "Click Me!");
setProperty(buttonComponent1, "icon_x_pos", 0.1);
// Binding an event
bindEvent(buttonComponent3, "on_press", "action");
function action(){
console.log("hello world");
}Properties
See the shared property list for all properties available for this component.
| Property | Type | Description |
|---|---|---|
| text | string | The text on the button component. |
| hide_text | bool | Hide the text on the button component. |
| keep_aspect_ratio_mode | bool | Keep aspect ratio when enabled. |
| default_filename | string | The filename of image. |
| down_filename | string | The filename of image when button is pressed. |
| disabled_filename | string | The filename of image when button is disabled. |
| slice_top, slice_bottom, slice_left, slice_right | number (Pixels) | Used to preserve the edges of an image when resizing. To quickly find optimal slice values, place a component using the editor and choose ‘Edit Values’. |
| border_scale | number (> 0) | Proportionally scales the sides, edges and corners of the nine slice image that are set in the editable values of the image used as a base for the component. |
| icon_filename | string | The filename of icon. |
| icon_scale | number (> 0) | Scales the icon based on native size of the icon. |
| font_color | string (0x000000 – 0xFFFFFFFF) | A Hex string in the form of RGBA (Red, Green, Blue, Alpha). E.g 0xFF0000FF will be red with 100% opacity. |
| font_filename | string | The filename of a font inside the /fonts folder (e.g vera.ttf). If the font isn’t found the text will disappear. |
| font_size | number (> 0) | The size of the font. Decimal values are allowed. |
| tracking | number | Distance between characters. |
| scale_border_with_screen | bool | Proportionally scales the sides, edges and corners of the nine slice image that are set in the editable values of the image used as a base for the component if it is true. |
| text_scaling | string | Scales the text. |
| caption_x_pos | number | The x position of the text |
| caption_y_pos | number | The y position of the text |
| icon_x_pos | real | The x position of the icon |
| icon_y_pos | real | The y position of the icon |
| enabled | bool | Enable / Disable the button |
See the shared event list for all events available for this component.