Use Ipypopout to display parts of your ipywidgets or solara app in separate browser windows. This is especially useful for those working with multiple screens.
Works with:
- Jupyter notebook
- Jupyter lab
- Voila (
version<0.5
) - Solara (
version>=1.22
)
import ipywidgets as widgets
from ipypopout import PopoutButton
main = widgets.VBox()
# see https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features
# for window_features
popout_button = PopoutButton(main, window_features='popup,width=400,height=600')
slider1 = widgets.IntSlider(value=1)
slider2 = widgets.IntSlider(value=2)
result = widgets.Label()
def update_result(_ignore=None):
result.value = value=f"Sum of {slider1.value} and {slider2.value} = {slider1.value + slider2.value}"
update_result()
main.children = (slider1, slider2, result, popout_button)
slider1.observe(update_result, "value")
slider2.observe(update_result, "value")
display(main)
ipywidgets-demo-1k.mp4
import solara
import plotly.express as px
import numpy as np
from ipypopout import PopoutButton
freq = solara.reactive(1)
damping = solara.reactive(0.5)
t = np.arange(0, 100, 0.1)/10
@solara.component
def Page():
target_model_id = solara.use_reactive("")
y = np.sin(t * 2 * np.pi * freq.value) * np.exp(-t*damping.value)
with solara.Column():
with solara.Card("Controls") as control:
solara.SliderFloat("Freq", value=freq, min=1, max=10)
solara.SliderFloat("zeta", value=damping, min=0, max=2)
if target_model_id.value:
PopoutButton.element(target_model_id=target_model_id.value, window_features='popup,width=400,height=300')
fig = px.line(x=t, y=y)
solara.FigurePlotly(fig)
# with solara we have to use use_effect + get_widget to get the widget id
solara.use_effect(lambda: target_model_id.set(solara.get_widget(control)._model_id))
display(Page())
Because Solara creates elements instead of widgets, we have to use the use_effect
/get_widget
trick to feed the widget ID to the PopoutButton.
solara-demo-notebook2.mp4
$ pip install "ipypopout[voila]"
or
$ pip install "ipypopout[solara]"
- PopoutButton
- constructor arguments:
target - ipywidgets.Widget | None
: The widget that will be shown in the popout window.target_model_id - str
: The widget id (defaults totarget._model_id
)window_name - str
: If a window with the same name is available it will be reused, otherwise a new window is created (defaults totarget_model_id
). See https://developer.mozilla.org/en-US/docs/Web/API/Window/open for more details.window_features - str
: See: https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features
- constructor arguments: