##// END OF EJS Templates
upstream » ipython
RSS

Clone from https://github.com/ipython/ipython.git

Merge pull request #6338 from aminb/cli-check_pid...
Merge pull request #6338 from aminb/cli-check_pid Add .NET implementation of check_pid
Jessica B. Hamrick - - Load All Authors

File last commit:

r16324:070546fe
r17691:d1365d77 merge
Show More
Widget Basics.ipynb
338 lines | 8.8 KiB | text/plain | TextLexer
/ examples / Interactive Widgets / Widget Basics.ipynb
History | Annotation | Raw |Copy content |Copy permalink

To use IPython widgets in the notebook, the widget namespace needs to be imported.

In [2]:
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

In [2]:
[widget for widget in dir(widgets) if widget.endswith('Widget')]
Out[2]:
['AccordionWidget',
 'BoundedFloatTextWidget',
 'BoundedIntTextWidget',
 'ButtonWidget',
 'CheckboxWidget',
 'ContainerWidget',
 'DOMWidget',
 'DropdownWidget',
 'FloatProgressWidget',
 'FloatSliderWidget',
 'FloatTextWidget',
 'HTMLWidget',
 'ImageWidget',
 'IntProgressWidget',
 'IntSliderWidget',
 'IntTextWidget',
 'LatexWidget',
 'PopupWidget',
 'RadioButtonsWidget',
 'SelectWidget',
 'TabWidget',
 'TextWidget',
 'TextareaWidget',
 'ToggleButtonWidget',
 'ToggleButtonsWidget',
 'Widget']

The basic widgets all have sensible default values. Create a FloatSliderWidget without displaying it:

In [3]:
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

In [4]:
display(mywidget)

or

In [5]:
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.

In [6]:
mywidget.keys
Out[6]:
['_view_name',
 'orientation',
 'min',
 'max',
 '_css',
 'value',
 'disabled',
 'visible',
 'step',
 'description']

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.

In [7]:
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).

In [8]:
mywidget.value
Out[8]:
25.0

Widget values can also be set with kwargs during the construction of the widget (as seen below).

In [9]:
mysecondwidget = widgets.RadioButtonsWidget(values=["Item A", "Item B", "Item C"], value="Item A")
display(mysecondwidget)
In [10]:
mysecondwidget.value
Out[10]:
'Item A'

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:

In [4]:
mytextwidget = widgets.TextWidget()
mytextwidget.placeholder = "type something here"
display(mytextwidget)
In [5]:
mytextareawidget = widgets.TextareaWidget()
mytextareawidget.placeholder = "your text here"
display(mytextareawidget)