##// END OF EJS Templates
Backport PR #5459: Fix interact animation page jump FF...
Backport PR #5459: Fix interact animation page jump FF Firefox doesn't render images immediately as the data is available. When animating the way that we animate, this causes the output area to collapse quickly before returning to its original size. When the output area collapses, FireFox scrolls upwards in attempt to compensate for the lost vertical content (so it looks like you are on the same spot in the page, with respect to the contents below the image's prior location). The solution is to resize the image output after the `img onload` event has fired. This PR: - Releases the `clear_output` height lock after the image has been loaded (instead of immediately or using a timeout). - Removes a `setTimeout` call in the `append_output` method. - `clear_output` in zmqshell no longer sends `\r` to the stream outputs. closes #5128

File last commit:

r16120:24b93a1d
r16229:ff1462d3
Show More
Widget Placement.ipynb
173 lines | 4.8 KiB | text/plain | TextLexer
In [1]:
from IPython.html import widgets # Widget definitions
from IPython.display import display # Used to display widgets in the notebook

Parent/Child Relationships

To display widget A inside widget B, widget A must be a child of widget B. Only one instance of any particular widget can be child of another. In other words, widget A cannot have widget B listed twice in it's list of children.

Widgets that can contain other widgets have a children attribute. This attribute 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.

In [2]:
float_range = widgets.FloatSliderWidget()
string = widgets.TextWidget(value='hi')
container = widgets.ContainerWidget(children=[float_range, string])

display(container) # Displays the `container` and all of it's children.

Children can also be added to parents after the parent has been displayed. The parent is responsible for rendering its children.

In [3]:
container = widgets.ContainerWidget()
display(container)

int_range = widgets.IntSliderWidget()
container.children=[int_range]

Visibility

Sometimes it is necessary to hide or show widgets in place, without having to redisplay the widget. The visibility property of widgets can be used to hide or show widgets that have already been displayed (as seen below).

In [4]:
string = widgets.LatexWidget(value="Hello World!")
display(string) 
In [5]:
string.visible=False
In [6]:
string.visible=True

In the example below, a form is rendered, which conditionally displays widgets depending on the state of other widgets. Try toggling the student checkbox.

In [7]:
form = widgets.ContainerWidget()
first = widgets.TextWidget(description="First Name:")
last = widgets.TextWidget(description="Last Name:")

student = widgets.CheckboxWidget(description="Student:", value=False)
school_info = widgets.ContainerWidget(visible=False, children=[
    widgets.TextWidget(description="School:"),
    widgets.IntTextWidget(description="Grade:", min=0, max=12)
    ])

pet = widgets.TextWidget(description="Pet's Name:")
form.children = [first, last, student, school_info, pet]
display(form)

def on_student_toggle(name, value):
    if value:
        school_info.visible = True
    else:
        school_info.visible = False
student.on_trait_change(on_student_toggle, 'value')