Button

Updated on 2025-03-24 GMT+08:00

View PDF

The button widget is usually used together with other widgets to display linked pages or prompt messages.

On the large screen design page, choose All > Others and drag the button widget to the blank area of the canvas, as shown in Figure 1.

Figure 1 Button widget

Configuration

You can set the button shortcut style and basic style.

Figure 2 Button configuration

Shortcut style setting: Set the button style (e.g., common, emphasis, or text).
Basic style settings
- Button: Button status, which can be enabled or disabled.
- Content: Text displayed on the button, e.g., "Save".
- Default text: Font, width, size, and color of the text displayed on the button.
- Default background color: Background color of the button in the default status.
- Hover text color: Color of the button text when the pointer hovers over it.
- Hover background color: Background color of a button when the pointer hovers over it.
- Selected text color: Color of the text displayed when the button is selected.
- Selected background color: Background color of the button when it is selected.
- Round corner: rounded corner of the button border. The radian of the four corners ranges from 0 to 500, in pixels.
- Inner margin: Space between the chart and the widget border, in pixels.

Interaction

In the interaction settings, you can configure interactions between the button widget and other widgets or pages. For details, see Interaction Configuration.

Parent topic: Others

Previous topic: Step Bar

Next topic: Menu