On this page

Dynamic Ui#

Download this notebook from GitHub (right-click to download).


import panel as pn

pn.extension()

This example demonstrates how to dynamically replace widgets in a layout to create responsive user interfaces (requires a live Python server).

selector = pn.widgets.Select(
    value=pn.widgets.ColorPicker, options=[
    pn.widgets.ColorPicker,
    pn.widgets.DatePicker,
    pn.widgets.FileInput,
    pn.widgets.FloatSlider,
    pn.widgets.RangeSlider,
    pn.widgets.Spinner,
    pn.widgets.TextInput,
], css_classes=['panel-widget-box'])

row = pn.Row(selector, pn.widgets.ColorPicker(), pn.pane.Str())

def update_value(event):
    row[2].object = 'Current Value: ' + str(event.new)

def update_widget(event):
    widget = event.new()
    widget.param.watch(update_value, 'value')
    widget.param.trigger('value')
    row[1] = widget

selector.param.watch(update_widget, 'value')
selector.param.trigger('value')

pn.Column(
    '## Dynamically generated user interfaces',
    row
)

App#

Lets wrap it into nice template that can be served via panel serve dynamic_ui.ipynb

pn.template.FastListTemplate(site="Panel", title="Dynamic UI", main=["This example demonstrates **how to dynamically replace widgets in a layout** to create responsive user interfaces", row]).servable();
This web page was generated from a Jupyter notebook and not all interactivity will work on this website. Right click to download and run locally for full Python-backed interactivity.

Download this notebook from GitHub (right-click to download).