• References
    • Main
    • RenderKit
    • LibJS
    • Canvas
  • Components
    • Overview
    • Page
    • Basic
      • Rectangle
      • Text
      • Button
      • HTML Article
      • Toggle Button
      • Tiler
      • Web View
      • Image Zoomer
    • Navigation
      • Carousel
    • Forms
      • Form
      • Text Entry
    • Layout
      • Group
  • Web API
  • Tutorials
  • Contact
Menu
  • References
    • Main
    • RenderKit
    • LibJS
    • Canvas
  • Components
    • Overview
    • Page
    • Basic
      • Rectangle
      • Text
      • Button
      • HTML Article
      • Toggle Button
      • Tiler
      • Web View
      • Image Zoomer
    • Navigation
      • Carousel
    • Forms
      • Form
      • Text Entry
    • Layout
      • Group
  • Web API
  • Tutorials
  • Contact
Umajin Developer > Components > Button

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.

PropertyTypeDescription
textstringThe text on the button component.
hide_textboolHide the text on the button component.
keep_aspect_ratio_modeboolKeep aspect ratio when enabled.
default_filenamestringThe filename of image.
down_filenamestringThe filename of image when button is pressed.
disabled_filenamestringThe filename of image when button is disabled.
slice_top, slice_bottom, slice_left, slice_rightnumber (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_scalenumber (> 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_filenamestringThe filename of icon.
icon_scalenumber (> 0)Scales the icon based on native size of the icon.
font_colorstring (0x000000 – 0xFFFFFFFF)
A Hex string in the form of RGBA (Red, Green, Blue, Alpha). E.g 0xFF0000FF will be red with 100% opacity.
font_filenamestringThe filename of a font inside the /fonts folder (e.g vera.ttf). If the font isn’t found the text will disappear.
font_sizenumber (> 0)The size of the font. Decimal values are allowed.
trackingnumberDistance between characters.
scale_border_with_screenboolProportionally 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_scalingstringScales the text.
caption_x_posnumberThe x position of the text
caption_y_posnumberThe y position of the text
icon_x_posrealThe x position of the icon
icon_y_posrealThe y position of the icon
enabledboolEnable / Disable the button

See the shared event list for all events available for this component.

  • Developer Home
  • Umajin Home
  • Support Home
Menu
  • Developer Home
  • Umajin Home
  • Support Home