A Button element is an interactive control that performs actions when tapped or long-pressed. You can customize its text, colors, size, corner radius, margins, and behaviors. It supports both OnClick and OnLongClick event arrays for defining different interactions.
| Field | Type | Default Value | Description |
|---|---|---|---|
| Name | String | {name} | Name of the button element. |
| Enable | Boolean | true | Enables or disables the button. |
| Elevation | Number | 0 | Shadow depth applied to the button surface. |
| Text | String | {text} | Text displayed inside the button. |
| Text.Color | Color | {textColor} | Color of the button text. |
| Text.Style | TextStyle | {textStyle} | Style of the text (bold, italic, etc.). |
| Text.Size | Number | 16 | Font size of the button text. |
| Color | Color | {color} | Background color of the button. |
| Size | Number | 0 | Height of the button. |
| Radius | Number | 12 | Corner roundness of the button. |
| Margin | Number | 20 | Outer margin around the button. |
| MarginLine | Number | 10 | Inner margin between the button and surrounding elements. |
| OnClick | Array |
[] | Actions triggered when the button is clicked. |
| OnLongClick | Array |
[] | Actions triggered when the button is long-pressed. |
Coding:
{
"@Type": "Button",
"Name": "{name}",
"Enable": true,
"Elevation": 0,
"Text": "{text}",
"Text.Color": "{textColor}",
"Text.Style": "{textStyle}",
"Text.Size": 16,
"Color": "{color}",
"Size": 0,
"Radius": 12,
"Margin": 20,
"MarginLine": 10,
"OnClick": [],
"OnLongClick": []
}To see how to create this element in Applin Studio (no-code mode), visit:
Design the Button in Applin Studio