ipywidgets_box

In [1]:

# import geogee
# Map = geogee.Map()
# Map

# import geogee # Map = geogee.Map() # Map

In [2]:

import ipywidgets as widgets

import ipywidgets as widgets

In [3]:

widget_width = "250px"
padding = "0px 0px 0px 4px"  # upper, right, bottom, left

widget_width = "250px" padding = "0px 0px 0px 4px" # upper, right, bottom, left

icon: https://fontawesome.com/v4.7.0/icons/

In [4]:

toolbar_button = widgets.ToggleButton(
    value=False,
    tooltip="Toolbar",
    icon="gear",
    layout=widgets.Layout(width="28px", height="28px", padding=padding),
)
toolbar_button

toolbar_button = widgets.ToggleButton( value=False, tooltip="Toolbar", icon="gear", layout=widgets.Layout(width="28px", height="28px", padding=padding), ) toolbar_button

Out[4]:

In [5]:

# toolbar_button.layout.width = "28px"

# toolbar_button.layout.width = "28px"

In [6]:

toolbar_button.value

toolbar_button.value

Out[6]:

False

In [7]:

close_button = widgets.ToggleButton(
    value=False,
    tooltip="Close the tool",
    icon="times",
    button_style="primary",
    layout=widgets.Layout(height="28px", width="28px", padding=padding),
)
close_button

close_button = widgets.ToggleButton( value=False, tooltip="Close the tool", icon="times", button_style="primary", layout=widgets.Layout(height="28px", width="28px", padding=padding), ) close_button

Out[7]:

In [8]:

widgets.HBox([close_button, toolbar_button])

widgets.HBox([close_button, toolbar_button])

Out[8]:

In [9]:

box = widgets.HBox()
box.children = [close_button, toolbar_button]
box

box = widgets.HBox() box.children = [close_button, toolbar_button] box

Out[9]:

In [10]:

checkbox = widgets.Checkbox(
    description="Checkbox",
    indent=False,
    layout=widgets.Layout(padding=padding, width=widget_width),
)
checkbox

checkbox = widgets.Checkbox( description="Checkbox", indent=False, layout=widgets.Layout(padding=padding, width=widget_width), ) checkbox

Out[10]:

In [11]:

dropdown = widgets.Dropdown(
    options=["Option 1", "Option 2", "Option 3"],
    value=None,
    description="Dropdown:",
    layout=widgets.Layout(width=widget_width, padding=padding),
    style={"description_width": "initial"},
)
dropdown

dropdown = widgets.Dropdown( options=["Option 1", "Option 2", "Option 3"], value=None, description="Dropdown:", layout=widgets.Layout(width=widget_width, padding=padding), style={"description_width": "initial"}, ) dropdown

Out[11]:

In [12]:

int_slider = widgets.IntSlider(
    min=1,
    max=100,
    description="Int Slider: ",
    readout=False,
    continuous_update=True,
    layout=widgets.Layout(width="220px", padding=padding),
    style={"description_width": "initial"},
)
int_slider

int_slider = widgets.IntSlider( min=1, max=100, description="Int Slider: ", readout=False, continuous_update=True, layout=widgets.Layout(width="220px", padding=padding), style={"description_width": "initial"}, ) int_slider

Out[12]:

In [13]:

int_slider_label = widgets.Label()
widgets.jslink((int_slider, "value"), (int_slider_label, "value"))

int_slider_label = widgets.Label() widgets.jslink((int_slider, "value"), (int_slider_label, "value"))

Out[13]:

Link(source=(IntSlider(value=1, description='Int Slider: ', layout=Layout(padding='0px 0px 0px 4px', width='220px'), min=1, readout=False, style=SliderStyle(description_width='initial')), 'value'), target=(Label(value=''), 'value'))

In [14]:

widgets.HBox([int_slider, int_slider_label])

widgets.HBox([int_slider, int_slider_label])

Out[14]:

In [15]:

float_slider = widgets.FloatSlider(
    min=1,
    max=100,
    description="Float Slider: ",
    readout=False,
    continuous_update=True,
    layout=widgets.Layout(width="220px", padding=padding),
    style={"description_width": "initial"},
)

float_slider_label = widgets.Label()
widgets.jslink((float_slider, "value"), (float_slider_label, "value"))
widgets.HBox([float_slider, float_slider_label])

float_slider = widgets.FloatSlider( min=1, max=100, description="Float Slider: ", readout=False, continuous_update=True, layout=widgets.Layout(width="220px", padding=padding), style={"description_width": "initial"}, ) float_slider_label = widgets.Label() widgets.jslink((float_slider, "value"), (float_slider_label, "value")) widgets.HBox([float_slider, float_slider_label])

Out[15]:

In [16]:

color = widgets.ColorPicker(
    concise=False,
    description="Color:",
    value="white",
    style={"description_width": "initial"},
    layout=widgets.Layout(width=widget_width, padding=padding),
)
color

color = widgets.ColorPicker( concise=False, description="Color:", value="white", style={"description_width": "initial"}, layout=widgets.Layout(width=widget_width, padding=padding), ) color

Out[16]:

In [17]:

text = widgets.Text(
    value="",
    description="Textbox:",
    placeholder="Enter sth.",
    style={"description_width": "initial"},
    layout=widgets.Layout(width=widget_width, padding=padding),
)
text

text = widgets.Text( value="", description="Textbox:", placeholder="Enter sth.", style={"description_width": "initial"}, layout=widgets.Layout(width=widget_width, padding=padding), ) text

Out[17]:

In [18]:

textarea = widgets.Textarea(
    placeholder="Placeholder",
    layout=widgets.Layout(width=widget_width),
)
textarea

textarea = widgets.Textarea( placeholder="Placeholder", layout=widgets.Layout(width=widget_width), ) textarea

Out[18]:

In [19]:

buttons = widgets.ToggleButtons(
    value=None,
    options=["Apply", "Reset", "Close"],
    tooltips=["Apply", "Reset", "Close"],
    button_style="primary",
)
buttons.style.button_width = "80px"
buttons

buttons = widgets.ToggleButtons( value=None, options=["Apply", "Reset", "Close"], tooltips=["Apply", "Reset", "Close"], button_style="primary", ) buttons.style.button_width = "80px" buttons

Out[19]:

In [20]:

output = widgets.Output(layout=widgets.Layout(width=widget_width, padding=padding))
with output:
    output.clear_output()
    print("Running ...")
output

output = widgets.Output(layout=widgets.Layout(width=widget_width, padding=padding)) with output: output.clear_output() print("Running ...") output

Out[20]:

In [21]:

toolbar_widget = widgets.VBox()
toolbar_widget.children = [
    widgets.HBox([close_button, toolbar_button]),
    checkbox,
    widgets.HBox([int_slider, int_slider_label]),
    widgets.HBox([float_slider, float_slider_label]),
    dropdown,
    text,
    color,
    textarea,
    buttons,
    output,
]
toolbar_widget

toolbar_widget = widgets.VBox() toolbar_widget.children = [ widgets.HBox([close_button, toolbar_button]), checkbox, widgets.HBox([int_slider, int_slider_label]), widgets.HBox([float_slider, float_slider_label]), dropdown, text, color, textarea, buttons, output, ] toolbar_widget

Out[21]: