from IPython.html import widgets # Widget definitions
from IPython.display import display # Used to display widgets in the notebook
display(widgets.TextWidget(description="a:"))
display(widgets.TextWidget(description="aa:"))
display(widgets.TextWidget(description="aaa:"))
display(widgets.TextWidget(description="a:"))
display(widgets.TextWidget(description="aa:"))
display(widgets.TextWidget(description="aaa:"))
display(widgets.TextWidget(description="aaaaaaaaaaaaaaaaaa:"))
display(widgets.TextWidget(description="a:"))
display(widgets.TextWidget(description="aa:"))
display(widgets.TextWidget(description="aaa:"))
display(widgets.TextWidget())
child_style = {
'background': '#77CC77',
'padding': '25px',
'margin': '5px',
'font-size': 'xx-large',
'color': 'white',
}
def make_container(title):
header = widgets.LatexWidget(value=title)
display(header)
header.set_css({
'font-size': '30pt',
'margin-top': '40pt',
'margin-bottom': '20pt',
})
container = widgets.ContainerWidget()
container.set_css({
'background': '#999999',
'width': '100%',
})
display(container)
return container
def fill_container(container):
components = []
for i in range(3):
components.append(widgets.LatexWidget(value="ABC"[i]))
components[i].set_css(child_style)
container.children = components
container = make_container('VBox')
container.add_class('vbox')
fill_container(container)
container = make_container('HBox')
container.remove_class('vbox')
container.add_class('hbox')
fill_container(container)
container = make_container('HBox Pack Start')
container.remove_class('vbox')
container.add_class('hbox')
container.add_class('start')
fill_container(container)
container = make_container('HBox Pack Center')
container.remove_class('vbox')
container.add_class('hbox')
container.add_class('center')
fill_container(container)
container = make_container('HBox Pack End')
container.remove_class('vbox')
container.add_class('hbox')
container.add_class('end')
fill_container(container)
def fill_container(container, flexes):
components = []
for i in range(len(flexes)):
components.append(widgets.ContainerWidget())
components[i].set_css(child_style)
label = widgets.LatexWidget(value=str(flexes[i]))
components[i].children = [label]
container.children = components
for i in range(len(flexes)):
if flexes[i] == 0:
components[i].add_class('box-flex0')
elif flexes[i] == 1:
components[i].add_class('box-flex1')
elif flexes[i] == 2:
components[i].add_class('box-flex2')
container = make_container('Different Flex Configurations')
container.remove_class('vbox')
container.add_class('hbox')
fill_container(container, [0, 0, 0])
container = make_container('')
container.remove_class('vbox')
container.add_class('hbox')
fill_container(container, [0, 0, 1])
container = make_container('')
container.remove_class('vbox')
container.add_class('hbox')
fill_container(container, [0, 1, 1])
container = make_container('')
container.remove_class('vbox')
container.add_class('hbox')
fill_container(container, [0, 2, 2])
container = make_container('')
container.remove_class('vbox')
container.add_class('hbox')
fill_container(container, [0, 1, 2])
container = make_container('')
container.remove_class('vbox')
container.add_class('hbox')
fill_container(container, [1, 1, 2])
def fill_container(container):
components = []
for i in range(3):
components.append(widgets.LatexWidget(parent=container, value="ABC"[i]))
components[i].set_css(child_style)
components[i].set_css('height', str((i+1) * 50) + 'px')
container.children = components
container = make_container('HBox Align Start')
container.remove_class('vbox')
container.add_class("hbox")
container.add_class("align-start")
fill_container(container)
container = make_container('HBox Align Center')
container.remove_class('vbox')
container.add_class("hbox")
container.add_class("align-center")
fill_container(container)
container = make_container('HBox Align End')
container.remove_class('vbox')
container.add_class("hbox")
container.add_class("align-end")
fill_container(container)
container = widgets.ContainerWidget()
container.children=[widgets.FloatSliderWidget(orientation='vertical', description=str(i+1), value=50.0)
for i in range(15)]
display(container)
container.remove_class('vbox')
container.add_class('hbox')