Button style¶

Defines the visual appearance of a button.

The Button Style JSON schema defines its structure.

A Button Style is a JSON object with the following properties.

`labels`¶

A required property that defines the button text for each state. It is a JSON object whose properties correspond to button states and whose values are Translation requests.

Property	Description
`normal`	Required. Default label.
`active`	Optional. Label for the active state. If omitted, the app uses the `normal` label.

{
  "labels": {
    "normal": {
      "raw": "Echo test"
    }
  }
}

`tooltip`¶

A required property that defines the tooltip text shown on hover. Its value is a Translation request.

{
  "tooltip": {
    "raw": "Echo test"
  }
}

`icons`¶

An optional property that defines the button icon for each UI state. It is a JSON object whose properties correspond to button states and whose values are Asset requests.

Property	Description
`normal`	Required. Default icon.
`hover`	Optional. Icon on hover.
`pressed`	Optional. Icon when pressed.
`active`	Optional. Icon when active.
`disabled`	Optional. Icon when disabled.

Examples¶

Icon from a URL¶

{
  "icons": {
    "normal": {
      "url": "https://example.com/icon.png"
    }
  }
}

Icons from the portal theme¶

{
  "icons": {
    "normal": {
      "android": "call_functions_button_custom_0",
      "ios": "call_functions_button_custom_0",
      "desktop": "desktopth_call_functions_button_custom_0"
    },
    "hover": {
      "android": "call_functions_button_custom_0",
      "ios": "call_functions_button_custom_0",
      "desktop": "desktopth_call_functions_button_custom_0_hover"
    },
    "pressed": {
      "android": "call_functions_button_custom_0",
      "ios": "call_functions_button_custom_0",
      "desktop": "desktopth_call_functions_button_custom_0_hover"
    }
  }
}