Button

This is the button component.

You can set its text, disable it, adjust its size and style, react to a click and add left or right icons.

Examples

Simple button

{
    "type": "button",
    "text": "My button",
    "onPressed": {
        "_type": "listener",
        "name": "buttonPressed"
    },
}

Disabled button

{
    "type": "button",
    "text": "My button",
    "disabled": true,
}

Size and style adjusted button

{
    "type": "button",
    "text": "My button",
    "size": "large",
    "mainStyle": "secondary",
}

Button with icons

{
    "type": "button",
    "text": "My button",
    "leftIcon": {
        "type": "icon",
        "value": "smart_button",
    },
    "rightIcon": {
        // You can also use a view instead of an icon
        "type": "text",
        "value": "This can be used as an icon"
    },
}

Properties

Attribute	Description	Type
_type	The identifier of the component	button
text	The value of the text inside the button	string
disabled	The button is disabled if true	boolean
leftIcon	The Icon to use	Icon
mainStyle	The style to use, the component will be changed according to the theme.	string primary secondary tertiary
onPressed		Listener
rightIcon	The Icon to use	Icon
size	The size to use, the component will be sized according to the value.	string medium small large
submit	Whether the button is a submit button for a form.	boolean