To use IPython widgets in the notebook, the widget namespace needs to be imported.
from IPython.html import widgets # Widget definitions
from IPython.display import display # Used to display widgets in the notebook
Basic Widgets¶
IPython comes with basic widgets that represent common interactive controls. These widgets are
- CheckboxWidget
- ToggleButtonWidget
- FloatSliderWidget
- BoundedFloatTextWidget
- FloatProgressWidget
- FloatTextWidget
- ImageWidget
- IntSliderWidget
- BoundedIntTextWidget
- IntProgressWidget
- IntTextWidget
- ToggleButtonsWidget
- RadioButtonsWidget
- DropdownWidget
- SelectWidget
- HTMLWidget
- LatexWidget
- TextareaWidget
- TextWidget
- ButtonWidget
A few special widgets are also included, that can be used to capture events and change how other widgets are displayed. These widgets are
- ContainerWidget
- PopupWidget
- AccordionWidget
- TabWidget
To see the complete list of widgets, one can execute the following
[widget for widget in dir(widgets) if widget.endswith('Widget')]
The basic widgets all have sensible default values. Create a FloatSliderWidget without displaying it:
mywidget = widgets.FloatSliderWidget()
Constructing a widget does not display it on the page. To display a widget, the widget must be passed to the IPython display(object) method or must be returned as the last item in the cell. mywidget is displayed by
display(mywidget)
or
mywidget
It's important to realize that widgets are not the same as output, even though they are displayed with display. Widgets are drawn in a special widget area. That area is marked with a close button which allows you to collapse the widgets. Widgets cannot be interleaved with output. Doing so would break the ability to make simple animations using clear_output.
Widgets are manipulated via special instance attributes (traitlets). The names of these traitlets are listed in the widget's keys attribute (as seen below). A few of these attributes are common to most widgets. The basic attributes are value, description, visible, and disabled. _css and _view_name are private attributes that exist in all widgets and should not be modified.
mywidget.keys
Changing a widget's attribute will automatically update that widget everywhere it is displayed in the notebook. Here, the value attribute of mywidget is set. The slider shown above updates automatically with the new value. Syncing also works in the other direction - changing the value of the displayed widget will update the property's value.
mywidget.value = 25.0
After changing the widget's value in the notebook by hand to 0.0 (sliding the bar to the far left).
mywidget.value
Widget values can also be set with kwargs during the construction of the widget (as seen below).
mysecondwidget = widgets.RadioButtonsWidget(values=["Item A", "Item B", "Item C"], value="Item A")
display(mysecondwidget)
mysecondwidget.value
Some widgets have special attributes. For example, text boxes and text areas can specify the placeholder attribute, which will set "placeholder" text to be displayed before the user has typed anything:
mytextwidget = widgets.TextWidget()
mytextwidget.placeholder = "type something here"
display(mytextwidget)
mytextareawidget = widgets.TextareaWidget()
mytextareawidget.placeholder = "your text here"
display(mytextareawidget)