Button
Last updated
Last updated
Button
widget in Supervisely is a user interface element that allows users to create clickable buttons in the appliactions. These buttons can be customized with text, size, colors, and icons, and can be used to trigger specific actions or workflows. The Button widget is a versatile tool that can help users automate repetitive tasks or streamline their workflows, making it a valuable addition to any project dashboard.
Determine text that will be displayed on the button.
type: str
default value: Button
Button type.
type: Literal["primary", "info", "warning", "danger", "success", "text"]
default value: "primary"
Button size.
type: Literal["mini", "small", "large", None]
default value: None
Determine whether button is a plain button.
type: bool
default value: False
Determine whether button is loading.
type: bool
default value: False
Button icon, accepts an icon name of icon component. Icons can be found at zavoloklom.github.io.
Open any icon at zavoloklom.github.io and copy it's name (see example below).
type: str
default value: None
Gap between icon and button text.
type: int
default value: 5
Emit an event on click
type: str
default value: ""
Specifies an inline style for an element.
type: str
default value: ""
Call JavaScript function on click.
type: str
default value: ""
ID of the widget.
type: str
default value: None
You can find this example in our Github repository:
ui-widgets-demos/controls/001_button/src/main.py
Init API for communicating with Supervisely Instance. First, we load environment variables with credentials:
Button
and Text
widgetsPrepare a layout for app using Card
widget with the content
parameter and place 3 widgets that we've just created in the Container
widget. Place order in the Container
is important, we want buttons to be displayed above Text
widget.
Create an app object with layout parameter.
Our app layout is ready. It's time to handle button clicks.
Use the decorator as shown below to handle button click. We have 2 buttons, one for adding and another one for subtracting
Parameters | Type | Description |
---|---|---|
text
str
Determine text that displayed on the button
button_type
Literal["primary", "info", "warning", "danger", "success", "text"]
Button type
button_size
Literal["mini", "small", "large", None]
Button size
plain
bool
Determine whether button is a plain button
show_loading
bool
If True
display loading animation when loading
property is True
icon
str
Button icon, accepts an icon name of icon from Material Design Iconic Font library
icon_gap
int
Gap between icon and button text
emit_on_click
str
Emit an event on click
call_on_click
str
Call JavaScript function on click
widget_id
str
ID of the widget