import panel as pn
pn.extension()
The ToggleIcon
widget allows toggling a single condition between True
/False
states. This widget is interchangeable with the Checkbox
and Toggle
widget.
Discover more on using widgets to add interactivity to your applications in the how-to guides on interactivity. Alternatively, learn how to set up callbacks and (JS-)links between parameters or how to use them as part of declarative UIs with Param.
For details on other options for customizing the component see the layout and styling how-to guides.
active_icon
(str): The name of the icon to display when toggled from tabler-icons.io/icon
(str): The name of the icon to display from tabler-icons.io/value
(boolean): Whether the icon is toggled on or offdisabled
(boolean): Whether the widget is editablename
(str): The title of the widgetsize
(str): Optional explicit size as a CSS font-size value, e.g. '1em' or '20px'.toggle = pn.widgets.ToggleIcon()
toggle
Toggle.value
is either True or False depending on whether the icon is toggled:
toggle.value
The value
can be modified by clicking the icon, or setting it explicitly.
toggle.value = True
By default, when value
is True
, the active_icon
(heart-filled
) is the filled version of the icon
(heart
).
If you'd like this to be changed, manually set the active_icon
.
pn.widgets.ToggleIcon(icon="thumb-down", active_icon="thumb-up")
The icon will automatically adapt to the specified width
/height
but you may also provide an explicit size
:
pn.widgets.ToggleIcon(icon="thumb-down", active_icon="thumb-up", size='3em')
The ToggleIcon
widget exposes a number of options which can be changed from both Python and Javascript. Try out the effect of these parameters interactively:
pn.Row(toggle.controls(jslink=True), toggle)