Tooltip
Last updated
Last updated
Tooltip
widget in Supervisely is a user interface element that displays prompt information for mouse hover. Uses like a wrapper around a main UI elements, such as Button
for example.
text
Union[str, List[str]]
Tooltip text. For a multi-line view, use List[str]
with each line as a value in the list
content
Widget
Widget
of the UI element for which the tooltip will be displayed
color_theme
Literal["dark", "light"]
One of "dark", "light"
color theme
placement
Literal["top","top-start", ...]
One of "top","top-start","top-end","bottom","bottom-start","bottom-end","left","left-start","left-end","right","right-start","right-end"
- place around the element where tooltip will be displayed
offset
int
Offset of the tooltip in pixels
transition
Literal["el-fade-in-linear","el-fade-in"]
One of "el-fade-in-linear", "el-fade-in"
describes the disappearance animation for widget
visible_arrow
bool
Determines whether the tooltip should have an arrow pointing to the item or not
open_delay
int
Display delay in milliseconds
enterable
bool
Determines whether the cursor can enter the tooltip area or not
hide_after
int
Hide delay in milliseconds. With the default value 0
, it will not be hidden as long as the mouse is inside the UI element.
widget_id
str
ID of the widget
Tooltip text. For a multi-line view, use List[str]
with each line as a value in the list
type: Union[str, List[str]]
Example with ['Tooltip text line 1', 'Tooltip text line 2']
:
The UI element for which the tooltip will be displayed.
type: Widget
Color theme of Tooltip widget.
type: Literal["dark", "light"]
default value: "dark"
Place around the element where tooltip will be displayed. Must be one of "top"
,"top-start"
,"top-end"
,"bottom"
,"bottom-start"
,"bottom-end"
,"left"
,"left-start"
,"left-end"
,"right"
,"right-start"
,"right-end"
values.
type: Literal["top","top-start", ...]
default value: "bottom"
Offset of the Tooltip in pixels.
type: int
default value: 0
Describes the disappearance animation for widget. Must be one of "el-fade-in-linear"
, "el-fade-in"
values.
type: Literal["el-fade-in-linear","el-fade-in"]
default value: "el-fade-in-linear"
Determines whether the tooltip should have an arrow pointing to the item or not.
type: bool
default value: True
Example with False
:
Display delay in milliseconds.
type: int
default value: 0
Example with 2000
value:
Determines whether the cursor can enter the tooltip area or not.
type: bool
default value: True
Hide delay in milliseconds. With the default value, it will not be hidden as long as the mouse is inside the UI element.
type: int
default value: 0
Example with 2000
value:
ID of the widget.
type: str
default value: None
set_text(text: Union[str, List[str]])
Set text for tooltip. For a multi-line text, use List[str]
with each line as a value in the list
set_placement(placement: Literal["top","top-start","top-end","bottom","bottom-start","bottom-end","left","left-start","left-end","right","right-start","right-end"])
Set place around the element where tooltip will be displayed
set_offset(offset: int)
Set offset of the tooltip in pixels
set_transition(transition: Literal["el-fade-in-linear", "el-fade-in"])
Set animation for widget disappearance
set_arrow_visibility(visible_arrow: bool)
Switch off or on the tooltip arrow pointing to the item
set_open_delay(open_delay: int)
Set the display delay in milliseconds
set_hide_after(hide_after: int)
Set the disappearance delay in milliseconds
You can find this example in our GitHub repository:
supervisely-ecosystem/ui-widgets-demos/text elements/006_tooltip/src/main.py
First, we load environment variables with credentials and init API for communicating with Supervisely Instance:
Main widget for application Button
, and interactive widget Tooltip
that will display additional information for the main widget.
Prepare a layout for app using Card
widget with the content
parameter and place widget that we've just created in the Container
widget.
Create an app object with layout parameter.