##// END OF EJS Templates
Updated widget tutorials 1-2
Jonathan Frederic -
Show More
@@ -17,7 +17,7 b''
17 17 "cell_type": "markdown",
18 18 "metadata": {},
19 19 "source": [
20 "To use IPython widgets in the notebook, the widget namespace and display function need to be imported."
20 "To use IPython widgets in the notebook, the widget namespace and optionally the display function need to be imported."
21 21 ]
22 22 },
23 23 {
@@ -46,20 +46,33 b''
46 46 "source": [
47 47 "The IPython notebook comes preloaded with basic widgets that represent common data types. These widgets are\n",
48 48 "\n",
49 "- BoolWidget : boolean \n",
50 "- FloatRangeWidget : bounded float \n",
51 "- FloatWidget : unbounded float \n",
52 "- ImageWidget : image\n",
53 "- IntRangeWidget : bounded integer \n",
54 "- IntWidget : unbounded integer \n",
55 "- SelectionWidget : enumeration \n",
56 "- StringWidget : string \n",
49 "- CheckBoxWidget\n",
50 "- ToggleButtonWidget\n",
51 "- FloatSliderWidget\n",
52 "- BoundedFloatTextWidget\n",
53 "- FloatProgressWidget\n",
54 "- FloatTextWidget\n",
55 "- ImageWidget\n",
56 "- IntSliderWidget\n",
57 "- BoundedIntTextWidget\n",
58 "- IntProgressWidget\n",
59 "- IntTextWidget\n",
60 "- ToggleButtonsWidget\n",
61 "- RadioButtonsWidget\n",
62 "- DropdownWidget\n",
63 "- ListBoxWidget\n",
64 "- HTMLWidget\n",
65 "- LatexWidget\n",
66 "- TextAreaWidget\n",
67 "- TextBoxWidget\n",
57 68 "\n",
58 69 "A few special widgets are also included, that can be used to capture events and change how other widgets are displayed. These widgets are\n",
59 70 "\n",
60 "- ButtonWidget \n",
61 "- ContainerWidget \n",
62 "- MulticontainerWidget \n",
71 "- ButtonWidget\n",
72 "- ContainerWidget\n",
73 "- PopupWidget\n",
74 "- AccordionWidget\n",
75 "- TabWidget\n",
63 76 "\n",
64 77 "To see the complete list of widgets, one can execute the following"
65 78 ]
@@ -78,18 +91,31 b''
78 91 "output_type": "pyout",
79 92 "prompt_number": 2,
80 93 "text": [
81 "['BoolWidget',\n",
94 "['AccordionWidget',\n",
95 " 'BoundedFloatTextWidget',\n",
96 " 'BoundedIntTextWidget',\n",
82 97 " 'ButtonWidget',\n",
98 " 'CheckBoxWidget',\n",
83 99 " 'ContainerWidget',\n",
84 100 " 'DOMWidget',\n",
85 " 'FloatRangeWidget',\n",
86 " 'FloatWidget',\n",
101 " 'DropdownWidget',\n",
102 " 'FloatProgressWidget',\n",
103 " 'FloatSliderWidget',\n",
104 " 'FloatTextWidget',\n",
105 " 'HTMLWidget',\n",
87 106 " 'ImageWidget',\n",
88 " 'IntRangeWidget',\n",
89 " 'IntWidget',\n",
90 " 'SelectionContainerWidget',\n",
91 " 'SelectionWidget',\n",
92 " 'StringWidget',\n",
107 " 'IntProgressWidget',\n",
108 " 'IntSliderWidget',\n",
109 " 'IntTextWidget',\n",
110 " 'LatexWidget',\n",
111 " 'ListBoxWidget',\n",
112 " 'PopupWidget',\n",
113 " 'RadioButtonsWidget',\n",
114 " 'TabWidget',\n",
115 " 'TextAreaWidget',\n",
116 " 'TextBoxWidget',\n",
117 " 'ToggleButtonWidget',\n",
118 " 'ToggleButtonsWidget',\n",
93 119 " 'Widget']"
94 120 ]
95 121 }
@@ -107,7 +133,7 b''
107 133 "cell_type": "code",
108 134 "collapsed": false,
109 135 "input": [
110 "mywidget = widgets.FloatRangeWidget()"
136 "mywidget = widgets.FloatSliderWidget()"
111 137 ],
112 138 "language": "python",
113 139 "metadata": {},
@@ -118,7 +144,7 b''
118 144 "cell_type": "markdown",
119 145 "metadata": {},
120 146 "source": [
121 "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. `mywidget` is displayed by"
147 "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"
122 148 ]
123 149 },
124 150 {
@@ -133,24 +159,22 b''
133 159 "prompt_number": 4
134 160 },
135 161 {
162 "cell_type": "markdown",
163 "metadata": {},
164 "source": [
165 "or"
166 ]
167 },
168 {
136 169 "cell_type": "code",
137 170 "collapsed": false,
138 171 "input": [
139 "mywidget.value\n"
172 "mywidget"
140 173 ],
141 174 "language": "python",
142 175 "metadata": {},
143 "outputs": [
144 {
145 "metadata": {},
146 "output_type": "pyout",
147 "prompt_number": 10,
148 "text": [
149 "50.6"
150 ]
151 }
152 ],
153 "prompt_number": 10
176 "outputs": [],
177 "prompt_number": 5
154 178 },
155 179 {
156 180 "cell_type": "markdown",
@@ -158,7 +182,7 b''
158 182 "source": [
159 183 "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`.\n",
160 184 "\n",
161 "Widgets are manipulated via special instance properties (traitlets). The names of these instance properties are listed in the widget's `keys` property (as seen below). A few of these properties are common to most, if not all, widgets. The common properties are `value`, `description`, `visible`, and `disabled`. `_css`, `_add_class`, and `_remove_class` are internal properties that exist in all widgets and should not be modified."
185 "Widgets are manipulated via special instance properties (traitlets). The names of these instance properties are listed in the widget's `keys` property (as seen below). A few of these properties are common to most, if not all, widgets. The common properties are `value`, `description`, `visible`, and `disabled`. `_css` and `_view_name` are internal properties that exist in all widgets and should not be modified."
162 186 ]
163 187 },
164 188 {
@@ -173,28 +197,28 b''
173 197 {
174 198 "metadata": {},
175 199 "output_type": "pyout",
176 "prompt_number": 11,
200 "prompt_number": 6,
177 201 "text": [
178 "['value',\n",
179 " 'step',\n",
180 " 'max',\n",
202 "['_view_name',\n",
203 " 'description',\n",
181 204 " 'min',\n",
182 " 'disabled',\n",
183 205 " 'orientation',\n",
184 " 'description',\n",
185 " 'visible',\n",
206 " 'max',\n",
186 207 " '_css',\n",
187 " 'view_name']"
208 " 'value',\n",
209 " 'disabled',\n",
210 " 'visible',\n",
211 " 'step']"
188 212 ]
189 213 }
190 214 ],
191 "prompt_number": 11
215 "prompt_number": 6
192 216 },
193 217 {
194 218 "cell_type": "markdown",
195 219 "metadata": {},
196 220 "source": [
197 "Changing a widget's property value will automatically update that widget everywhere it is displayed in the notebook. Here the value of `mywidget` is set. The slider shown above (after input 4) updates automatically to the new value. In reverse, changing the value of the displayed widget will update the property's value."
221 "Changing a widget's property value will automatically update that widget everywhere it is displayed in the notebook. Here the value of `mywidget` is set. The slider shown above (after inputs 4 and 5) updates automatically to the new value. In reverse, changing the value of the displayed widget will update the property's value."
198 222 ]
199 223 },
200 224 {
@@ -206,7 +230,7 b''
206 230 "language": "python",
207 231 "metadata": {},
208 232 "outputs": [],
209 "prompt_number": 12
233 "prompt_number": 7
210 234 },
211 235 {
212 236 "cell_type": "markdown",
@@ -227,13 +251,13 b''
227 251 {
228 252 "metadata": {},
229 253 "output_type": "pyout",
230 "prompt_number": 13,
254 "prompt_number": 8,
231 255 "text": [
232 "25.0"
256 "0.0"
233 257 ]
234 258 }
235 259 ],
236 "prompt_number": 13
260 "prompt_number": 8
237 261 },
238 262 {
239 263 "cell_type": "markdown",
@@ -246,13 +270,13 b''
246 270 "cell_type": "code",
247 271 "collapsed": false,
248 272 "input": [
249 "mysecondwidget = widgets.SelectionWidget(values=[\"Item A\", \"Item B\", \"Item C\"], value=\"Nothing Selected\")\n",
273 "mysecondwidget = widgets.RadioButtonsWidget(values=[\"Item A\", \"Item B\", \"Item C\"], value=\"Item A\")\n",
250 274 "display(mysecondwidget)"
251 275 ],
252 276 "language": "python",
253 277 "metadata": {},
254 278 "outputs": [],
255 "prompt_number": 14
279 "prompt_number": 9
256 280 },
257 281 {
258 282 "cell_type": "code",
@@ -266,101 +290,13 b''
266 290 {
267 291 "metadata": {},
268 292 "output_type": "pyout",
269 "prompt_number": 15,
270 "text": [
271 "u'Item B'"
272 ]
273 }
274 ],
275 "prompt_number": 15
276 },
277 {
278 "cell_type": "heading",
279 "level": 1,
280 "metadata": {},
281 "source": [
282 "Views"
283 ]
284 },
285 {
286 "cell_type": "markdown",
287 "metadata": {},
288 "source": [
289 "The data types that most of the widgets represent can be displayed more than one way. A `view` is a visual representation of a widget in the notebook. In the example in the section above, the default `view` for the `FloatRangeWidget` is used. The default view is set in the widgets `default_view_name` instance property (as seen below)."
290 ]
291 },
292 {
293 "cell_type": "code",
294 "collapsed": false,
295 "input": [
296 "mywidget.default_view_name"
297 ],
298 "language": "python",
299 "metadata": {},
300 "outputs": [
301 {
302 "metadata": {},
303 "output_type": "pyout",
304 "prompt_number": 19,
293 "prompt_number": 10,
305 294 "text": [
306 "u'FloatSliderView'"
295 "'Item A'"
307 296 ]
308 297 }
309 298 ],
310 "prompt_number": 19
311 },
312 {
313 "cell_type": "markdown",
314 "metadata": {},
315 "source": [
316 "When a widget is displayed using `display(...)`, the `default_view_name` is used to determine what view type should be used to display the widget. View names are case sensitive. Sometimes the default view isn't the best view to represent a piece of data. To change what view is used, either the `default_view_name` can be changed or the `view_name` kwarg of `display` can be set. This also can be used to display one widget multiple ways in one output (as seen below)."
317 ]
318 },
319 {
320 "cell_type": "code",
321 "collapsed": false,
322 "input": [
323 "display(mywidget)\n",
324 "display(mywidget, view_name=\"FloatTextView\")"
325 ],
326 "language": "python",
327 "metadata": {},
328 "outputs": [],
329 "prompt_number": 20
330 },
331 {
332 "cell_type": "markdown",
333 "metadata": {},
334 "source": [
335 "Some views work with multiple different widget types and some views only work with one. The complete list of views and supported widgets is below. The default views are italicized.\n",
336 "\n",
337 "| Widget Name | View Names |\n",
338 "|:-----------------------|:--------------------|\n",
339 "| BoolWidget | *CheckboxView* |\n",
340 "| | ToggleButtonView |\n",
341 "| ButtonWidget | *ButtonView* |\n",
342 "| ContainerWidget | *ContainerView* |\n",
343 "| | ModalView |\n",
344 "| FloatRangeWidget | *FloatSliderView* |\n",
345 "| | FloatTextView |\n",
346 "| | ProgressView |\n",
347 "| FloatWidget | *FloatTextView* |\n",
348 "| ImageWidget | *ImageView* |\n",
349 "| IntRangeWidget | *IntSliderView* |\n",
350 "| | IntTextView |\n",
351 "| | ProgressView |\n",
352 "| IntWidget | *IntTextView* |\n",
353 "| MulticontainerWidget | AccordionView |\n",
354 "| | *TabView* |\n",
355 "| SelectionWidget | ToggleButtonsView |\n",
356 "| | RadioButtonsView |\n",
357 "| | *DropdownView* |\n",
358 "| | ListBoxView |\n",
359 "| StringWidget | HTMLView |\n",
360 "| | LatexView |\n",
361 "| | TextAreaView |\n",
362 "| | *TextBoxView* |\n"
363 ]
299 "prompt_number": 10
364 300 }
365 301 ],
366 302 "metadata": {}
@@ -102,7 +102,7 b''
102 102 "cell_type": "code",
103 103 "collapsed": false,
104 104 "input": [
105 "intrange = widgets.IntRangeWidget()\n",
105 "intrange = widgets.IntSliderWidget()\n",
106 106 "display(intrange)\n",
107 107 "\n",
108 108 "def on_value_change(name, value):\n",
@@ -117,223 +117,6 b''
117 117 "output_type": "stream",
118 118 "stream": "stdout",
119 119 "text": [
120 "2\n"
121 ]
122 },
123 {
124 "output_type": "stream",
125 "stream": "stdout",
126 "text": [
127 "5\n"
128 ]
129 },
130 {
131 "output_type": "stream",
132 "stream": "stdout",
133 "text": [
134 "10\n"
135 ]
136 },
137 {
138 "output_type": "stream",
139 "stream": "stdout",
140 "text": [
141 "11\n"
142 ]
143 },
144 {
145 "output_type": "stream",
146 "stream": "stdout",
147 "text": [
148 "13\n"
149 ]
150 },
151 {
152 "output_type": "stream",
153 "stream": "stdout",
154 "text": [
155 "14\n"
156 ]
157 },
158 {
159 "output_type": "stream",
160 "stream": "stdout",
161 "text": [
162 "16\n"
163 ]
164 },
165 {
166 "output_type": "stream",
167 "stream": "stdout",
168 "text": [
169 "18\n"
170 ]
171 },
172 {
173 "output_type": "stream",
174 "stream": "stdout",
175 "text": [
176 "20\n"
177 ]
178 },
179 {
180 "output_type": "stream",
181 "stream": "stdout",
182 "text": [
183 "22\n"
184 ]
185 },
186 {
187 "output_type": "stream",
188 "stream": "stdout",
189 "text": [
190 "24\n"
191 ]
192 },
193 {
194 "output_type": "stream",
195 "stream": "stdout",
196 "text": [
197 "26\n"
198 ]
199 },
200 {
201 "output_type": "stream",
202 "stream": "stdout",
203 "text": [
204 "29\n"
205 ]
206 },
207 {
208 "output_type": "stream",
209 "stream": "stdout",
210 "text": [
211 "30\n"
212 ]
213 },
214 {
215 "output_type": "stream",
216 "stream": "stdout",
217 "text": [
218 "33\n"
219 ]
220 },
221 {
222 "output_type": "stream",
223 "stream": "stdout",
224 "text": [
225 "36\n"
226 ]
227 },
228 {
229 "output_type": "stream",
230 "stream": "stdout",
231 "text": [
232 "38\n"
233 ]
234 },
235 {
236 "output_type": "stream",
237 "stream": "stdout",
238 "text": [
239 "42\n"
240 ]
241 },
242 {
243 "output_type": "stream",
244 "stream": "stdout",
245 "text": [
246 "45\n"
247 ]
248 },
249 {
250 "output_type": "stream",
251 "stream": "stdout",
252 "text": [
253 "46\n"
254 ]
255 },
256 {
257 "output_type": "stream",
258 "stream": "stdout",
259 "text": [
260 "48\n"
261 ]
262 },
263 {
264 "output_type": "stream",
265 "stream": "stdout",
266 "text": [
267 "50\n"
268 ]
269 },
270 {
271 "output_type": "stream",
272 "stream": "stdout",
273 "text": [
274 "51\n"
275 ]
276 },
277 {
278 "output_type": "stream",
279 "stream": "stdout",
280 "text": [
281 "52\n"
282 ]
283 },
284 {
285 "output_type": "stream",
286 "stream": "stdout",
287 "text": [
288 "53\n"
289 ]
290 },
291 {
292 "output_type": "stream",
293 "stream": "stdout",
294 "text": [
295 "54\n"
296 ]
297 },
298 {
299 "output_type": "stream",
300 "stream": "stdout",
301 "text": [
302 "52\n"
303 ]
304 },
305 {
306 "output_type": "stream",
307 "stream": "stdout",
308 "text": [
309 "50\n"
310 ]
311 },
312 {
313 "output_type": "stream",
314 "stream": "stdout",
315 "text": [
316 "48\n"
317 ]
318 },
319 {
320 "output_type": "stream",
321 "stream": "stdout",
322 "text": [
323 "44\n"
324 ]
325 },
326 {
327 "output_type": "stream",
328 "stream": "stdout",
329 "text": [
330 "41\n"
331 ]
332 },
333 {
334 "output_type": "stream",
335 "stream": "stdout",
336 "text": [
337 120 "34\n"
338 121 ]
339 122 },
@@ -341,35 +124,14 b''
341 124 "output_type": "stream",
342 125 "stream": "stdout",
343 126 "text": [
344 "30\n"
345 ]
346 },
347 {
348 "output_type": "stream",
349 "stream": "stdout",
350 "text": [
351 "28\n"
352 ]
353 },
354 {
355 "output_type": "stream",
356 "stream": "stdout",
357 "text": [
358 "26\n"
127 "74\n"
359 128 ]
360 129 },
361 130 {
362 131 "output_type": "stream",
363 132 "stream": "stdout",
364 133 "text": [
365 "25\n"
366 ]
367 },
368 {
369 "output_type": "stream",
370 "stream": "stdout",
371 "text": [
372 "24\n"
134 "98\n"
373 135 ]
374 136 }
375 137 ],
@@ -411,8 +173,9 b''
411 173 "output_type": "stream",
412 174 "stream": "stdout",
413 175 "text": [
414 "Register a callback to execute when the button is clicked. The\n",
415 " callback can either accept no parameters or one sender parameter:\n",
176 "Register a callback to execute when the button is clicked. \n",
177 "\n",
178 " The callback can either accept no parameters or one sender parameter:\n",
416 179 " - callback()\n",
417 180 " - callback(sender)\n",
418 181 " If the callback has a sender parameter, the ButtonWidget instance that\n",
@@ -438,123 +201,11 b''
438 201 "cell_type": "code",
439 202 "collapsed": false,
440 203 "input": [
441 "display(intrange)\n",
442 "print('hi')"
443 ],
444 "language": "python",
445 "metadata": {},
446 "outputs": [
447 {
448 "output_type": "stream",
449 "stream": "stdout",
450 "text": [
451 "hi\n"
452 ]
453 },
454 {
455 "output_type": "stream",
456 "stream": "stdout",
457 "text": [
458 "23\n"
459 ]
460 },
461 {
462 "output_type": "stream",
463 "stream": "stdout",
464 "text": [
465 "24\n"
466 ]
467 },
468 {
469 "output_type": "stream",
470 "stream": "stdout",
471 "text": [
472 "28\n"
473 ]
474 },
475 {
476 "output_type": "stream",
477 "stream": "stdout",
478 "text": [
479 "30\n"
480 ]
481 },
482 {
483 "output_type": "stream",
484 "stream": "stdout",
485 "text": [
486 "37\n"
487 ]
488 },
489 {
490 "output_type": "stream",
491 "stream": "stdout",
492 "text": [
493 "39\n"
494 ]
495 },
496 {
497 "output_type": "stream",
498 "stream": "stdout",
499 "text": [
500 "41\n"
501 ]
502 },
503 {
504 "output_type": "stream",
505 "stream": "stdout",
506 "text": [
507 "44\n"
508 ]
509 },
510 {
511 "output_type": "stream",
512 "stream": "stdout",
513 "text": [
514 "46\n"
515 ]
516 },
517 {
518 "output_type": "stream",
519 "stream": "stdout",
520 "text": [
521 "48\n"
522 ]
523 },
524 {
525 "output_type": "stream",
526 "stream": "stdout",
527 "text": [
528 "50\n"
529 ]
530 },
531 {
532 "output_type": "stream",
533 "stream": "stdout",
534 "text": [
535 "51\n"
536 ]
537 },
538 {
539 "output_type": "stream",
540 "stream": "stdout",
541 "text": [
542 "53\n"
543 ]
544 }
545 ],
546 "prompt_number": 5
547 },
548 {
549 "cell_type": "code",
550 "collapsed": false,
551 "input": [
552 204 "button = widgets.ButtonWidget(description=\"Click Me!\")\n",
553 205 "display(button)\n",
554 206 "\n",
555 207 "def on_button_clicked(sender):\n",
556 208 " print(\"Button clicked.\")\n",
557 " intrange.value +=1\n",
558 209 "\n",
559 210 "button.on_click(on_button_clicked)"
560 211 ],
@@ -565,28 +216,25 b''
565 216 "output_type": "stream",
566 217 "stream": "stdout",
567 218 "text": [
568 "Button clicked.\n",
569 "54\n"
219 "Button clicked.\n"
570 220 ]
571 221 },
572 222 {
573 223 "output_type": "stream",
574 224 "stream": "stdout",
575 225 "text": [
576 "Button clicked.\n",
577 "55\n"
226 "Button clicked.\n"
578 227 ]
579 228 },
580 229 {
581 230 "output_type": "stream",
582 231 "stream": "stdout",
583 232 "text": [
584 "Button clicked.\n",
585 "56\n"
233 "Button clicked.\n"
586 234 ]
587 235 }
588 236 ],
589 "prompt_number": 6
237 "prompt_number": 5
590 238 },
591 239 {
592 240 "cell_type": "markdown",
@@ -598,62 +246,24 b''
598 246 {
599 247 "cell_type": "code",
600 248 "collapsed": false,
601 "input": [],
602 "language": "python",
603 "metadata": {},
604 "outputs": [
605 {
606 "metadata": {},
607 "output_type": "pyout",
608 "prompt_number": 11,
609 "text": [
610 "{'content': {'data': \"{'parent_header': {}, 'msg_type': u'comm_msg', 'msg_id': u'3DBB06AD83C942DD85DC6477B08F1FBF', 'content': {u'data': {u'method': u'custom', u'custom_content': {u'event': u'click'}}, u'comm_id': u'eea5f11ae7aa473993dd0c81d6016648'}, 'header': {u'username': u'username', u'msg_id': u'3DBB06AD83C942DD85DC6477B08F1FBF', u'msg_type': u'comm_msg', u'session': u'0F6D6BE728DA47A38CFC4BDEACF34FC4'}, 'buffers': [], 'metadata': {}}\\ncustom message {'parent_header': {}, 'msg_type': u'comm_msg', 'msg_id': u'3DBB06AD83C942DD85DC6477B08F1FBF', 'content': {u'data': {u'method': u'custom', u'custom_content': {u'event': u'click'}}, u'comm_id': u'eea5f11ae7aa473993dd0c81d6016648'}, 'header': {u'username': u'username', u'msg_id': u'3DBB06AD83C942DD85DC6477B08F1FBF', u'msg_type': u'comm_msg', u'session': u'0F6D6BE728DA47A38CFC4BDEACF34FC4'}, 'buffers': [], 'metadata': {}}\\nhandling click\\n{u'event': u'click'}\\nButton clicked.\\n2\\n\",\n",
611 " 'name': 'stdout'},\n",
612 " 'header': {'msg_id': 'd9dc144a-d86c-42c1-8bab-f8a6bc525723',\n",
613 " 'msg_type': 'stream',\n",
614 " 'session': '9b9408d8-7420-4e0c-976d-cdda9f8d2564',\n",
615 " 'username': 'kernel'},\n",
616 " 'metadata': {},\n",
617 " 'msg_id': 'd9dc144a-d86c-42c1-8bab-f8a6bc525723',\n",
618 " 'msg_type': 'stream',\n",
619 " 'parent_header': {'msg_id': '3DBB06AD83C942DD85DC6477B08F1FBF',\n",
620 " 'msg_type': 'comm_msg',\n",
621 " 'session': '0F6D6BE728DA47A38CFC4BDEACF34FC4',\n",
622 " 'username': 'username'}}"
623 ]
624 }
625 ],
626 "prompt_number": 11
627 },
628 {
629 "cell_type": "code",
630 "collapsed": false,
631 249 "input": [
632 "def show_button(sender=None):\n",
250 "def show_button(sender):\n",
633 251 " button = widgets.ButtonWidget()\n",
634 252 " button.clicks = 0\n",
635 " if sender is None:\n",
636 " button.description = \"0\"\n",
637 " else:\n",
638 " sender.clicks += 1\n",
639 " button.description = \"%d\" % sender.clicks\n",
253 " sender.clicks += 1\n",
254 " button.description = \"%d\" % sender.clicks\n",
640 255 " display(button)\n",
641 256 " button.on_click(show_button)\n",
642 "show_button()\n",
257 "button = widgets.ButtonWidget(description = \"Start\")\n",
258 "button.clicks = 0\n",
259 "display(button)\n",
260 "button.on_click(show_button)\n",
643 261 " "
644 262 ],
645 263 "language": "python",
646 264 "metadata": {},
647 265 "outputs": [],
648 "prompt_number": 7
649 },
650 {
651 "cell_type": "code",
652 "collapsed": false,
653 "input": [],
654 "language": "python",
655 "metadata": {},
656 "outputs": []
266 "prompt_number": 6
657 267 }
658 268 ],
659 269 "metadata": {}
@@ -17,9 +17,6 b''
17 17 "cell_type": "code",
18 18 "collapsed": false,
19 19 "input": [
20 "\n",
21 "\n",
22 "\n",
23 20 "from IPython.html import widgets # Widget definitions\n",
24 21 "from IPython.display import display # Used to display widgets in the notebook"
25 22 ],
@@ -40,27 +37,37 b''
40 37 "cell_type": "markdown",
41 38 "metadata": {},
42 39 "source": [
43 "To display widget A inside widget B, widget A must be a child of widget B. With IPython widgets, the widgets are instances that live in the back-end (usally Python). There can be multiple views displayed in the front-end that represent one widget in the backend. Each view can be displayed at a different time, or even displayed two or more times in the same output. Because of this, the parent of a widget can only be set before the widget has been displayed.\n",
40 "To display widget A inside widget B, widget A must be a child of widget B. With IPython widgets, the widgets are instances that live in the back-end (usally Python). There can be multiple views displayed in the front-end that represent one widget in the backend. Each view can be displayed at a different time. Only one instance of any particular model can be child of another. In other words, *widget A* cannot have *widget B* listed twice in it's children list.\n",
44 41 "\n",
45 "Every widget has a `parent` property. This property can be set via a kwarg in the widget's constructor or after construction, but before display. Calling display on an object with children automatically displays those children too (as seen below)."
42 "Widgets that can contain other widgets have a `children` property. This property can be set via a kwarg in the widget's constructor or after construction. Calling display on an object with children automatically displays those children too (as seen below)."
46 43 ]
47 44 },
48 45 {
49 46 "cell_type": "code",
50 47 "collapsed": false,
51 48 "input": [
49 "floatrange = widgets.FloatSliderWidget() # You can set the parent in the constructor,\n",
52 50 "\n",
53 "floatrange = widgets.FloatRangeWidget() # You can set the parent in the constructor,\n",
54 "\n",
55 "string = widgets.StringWidget(value='hi')\n",
51 "string = widgets.TextBocWidget(value='hi')\n",
56 52 "container = widgets.ContainerWidget(children=[floatrange, string])\n",
57 53 "\n",
58 54 "display(container) # Displays the `container` and all of it's children."
59 55 ],
60 56 "language": "python",
61 57 "metadata": {},
62 "outputs": [],
63 "prompt_number": 2
58 "outputs": [
59 {
60 "ename": "AttributeError",
61 "evalue": "'module' object has no attribute 'TextBocWidget'",
62 "output_type": "pyerr",
63 "traceback": [
64 "\u001b[1;31m---------------------------------------------------------------------------\u001b[0m\n\u001b[1;31mAttributeError\u001b[0m Traceback (most recent call last)",
65 "\u001b[1;32m<ipython-input-4-085d43fdae3d>\u001b[0m in \u001b[0;36m<module>\u001b[1;34m()\u001b[0m\n\u001b[0;32m 1\u001b[0m \u001b[0mfloatrange\u001b[0m \u001b[1;33m=\u001b[0m \u001b[0mwidgets\u001b[0m\u001b[1;33m.\u001b[0m\u001b[0mFloatSliderWidget\u001b[0m\u001b[1;33m(\u001b[0m\u001b[1;33m)\u001b[0m \u001b[1;31m# You can set the parent in the constructor,\u001b[0m\u001b[1;33m\u001b[0m\u001b[0m\n\u001b[0;32m 2\u001b[0m \u001b[1;33m\u001b[0m\u001b[0m\n\u001b[1;32m----> 3\u001b[1;33m \u001b[0mstring\u001b[0m \u001b[1;33m=\u001b[0m \u001b[0mwidgets\u001b[0m\u001b[1;33m.\u001b[0m\u001b[0mTextBocWidget\u001b[0m\u001b[1;33m(\u001b[0m\u001b[0mvalue\u001b[0m\u001b[1;33m=\u001b[0m\u001b[1;34m'hi'\u001b[0m\u001b[1;33m)\u001b[0m\u001b[1;33m\u001b[0m\u001b[0m\n\u001b[0m\u001b[0;32m 4\u001b[0m \u001b[0mcontainer\u001b[0m \u001b[1;33m=\u001b[0m \u001b[0mwidgets\u001b[0m\u001b[1;33m.\u001b[0m\u001b[0mContainerWidget\u001b[0m\u001b[1;33m(\u001b[0m\u001b[0mchildren\u001b[0m\u001b[1;33m=\u001b[0m\u001b[1;33m[\u001b[0m\u001b[0mfloatrange\u001b[0m\u001b[1;33m,\u001b[0m \u001b[0mstring\u001b[0m\u001b[1;33m]\u001b[0m\u001b[1;33m)\u001b[0m\u001b[1;33m\u001b[0m\u001b[0m\n\u001b[0;32m 5\u001b[0m \u001b[1;33m\u001b[0m\u001b[0m\n",
66 "\u001b[1;31mAttributeError\u001b[0m: 'module' object has no attribute 'TextBocWidget'"
67 ]
68 }
69 ],
70 "prompt_number": 4
64 71 },
65 72 {
66 73 "cell_type": "markdown",
General Comments 0
You need to be logged in to leave comments. Login now