{
"cells": [
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"parameters"
]
},
"outputs": [],
"source": [
"flex_vertical_layout = \"scroll\"\n",
"flex_author = \"built using jupyter-flex\"\n",
"flex_source_link = \"https://github.com/danielfrg/jupyter-flex/blob/master/examples/widgets/ipywidgets-gallery.ipynb\"\n",
"flex_include_source = True"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# Page 1"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 1 - Numeric Widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Int Slider"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"source"
]
},
"outputs": [],
"source": [
"import ipywidgets as widgets"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.IntSlider(\n",
" value=7,\n",
" min=0,\n",
" max=10,\n",
" step=1,\n",
" description='',\n",
" disabled=False,\n",
" continuous_update=False,\n",
" orientation='horizontal',\n",
" readout=True,\n",
" readout_format='d'\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Float Slider"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.FloatSlider(\n",
" value=7.5,\n",
" min=0,\n",
" max=10.0,\n",
" step=0.1,\n",
" description='',\n",
" disabled=False,\n",
" continuous_update=False,\n",
" orientation='horizontal',\n",
" readout=True,\n",
" readout_format='.1f',\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Float Log Slider"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.FloatLogSlider(\n",
" value=10,\n",
" base=10,\n",
" min=-10, # max exponent of base\n",
" max=10, # min exponent of base\n",
" step=0.2, # exponent step\n",
" description=''\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 2 - Numeric Widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Int Range Slider"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.IntRangeSlider(\n",
" value=[5, 7],\n",
" min=0,\n",
" max=10,\n",
" step=1,\n",
" description='',\n",
" disabled=False,\n",
" continuous_update=False,\n",
" orientation='horizontal',\n",
" readout=True,\n",
" readout_format='d',\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Float Range Slider"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.FloatRangeSlider(\n",
" value=[4.5, 7.5],\n",
" min=0,\n",
" max=10.0,\n",
" step=0.1,\n",
" description='',\n",
" disabled=False,\n",
" continuous_update=False,\n",
" orientation='horizontal',\n",
" readout=True,\n",
" readout_format='.1f',\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Int Progress"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.IntProgress()\n",
"\n",
"control = widgets.IntSlider(description=\"Control\", value=77)\n",
"widgets.link((control, 'value'), (widget, 'value'))\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, control, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Float Progress"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.FloatProgress()\n",
"\n",
"control = widgets.FloatSlider(description=\"Control\", value=31.51)\n",
"widgets.link((control, 'value'), (widget, 'value'))\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, control, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 3 - Numeric Widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Bounded Int Text"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.BoundedIntText(\n",
" value=7,\n",
" min=0,\n",
" max=10,\n",
" step=1,\n",
" description='From [0-10]:',\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Bounded Float Text"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.BoundedFloatText(\n",
" value=7.5,\n",
" min=0,\n",
" max=10.0,\n",
" step=0.1,\n",
" description='From [0-10]:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Int Text"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.IntText(\n",
" value=7,\n",
" description='Any:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Float Text"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.FloatText(\n",
" value=3.3,\n",
" description='Any:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 4 - Boolean Widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Toggle Button"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.ToggleButton(\n",
" value=False,\n",
" description='Click me',\n",
" disabled=False,\n",
" button_style='', # 'success', 'info', 'warning', 'danger' or ''\n",
" tooltip='Description',\n",
" icon='check' # (FontAwesome names without the `fa-` prefix)\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Checkbox"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Checkbox(\n",
" value=False,\n",
" description='Check me',\n",
" disabled=False,\n",
" indent=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Valid"
]
},
{
"cell_type": "markdown",
"metadata": {
"tags": [
"body"
]
},
"source": [
"The valid widget provides a read-only indicator."
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"widgets.Valid?"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Valid(\n",
" value=False,\n",
" description='Valid:',\n",
")\n",
"\n",
"control = widgets.Checkbox(description=\"Control\")\n",
"widgets.link((control, 'value'), (widget, 'value'))\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, control, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 5 - Selection Widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Dropdown"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Dropdown(\n",
" options=['1', '2', '3'],\n",
" value='2',\n",
" description='Number:',\n",
" disabled=False,\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Radio Buttons"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.RadioButtons(\n",
" options=['pepperoni', 'pineapple', 'anchovies'],\n",
"# value='pineapple', # Defaults to 'pineapple'\n",
" layout={'width': 'max-content'}, # If the items' names are long\n",
" description='Pizza topping:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )\n"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Select"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Select(\n",
" options=['Linux', 'Windows', 'OSX'],\n",
" value='OSX',\n",
" # rows=10,\n",
" description='OS:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 6 - Selection Widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Selection Slider"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.SelectionSlider(\n",
" options=['scrambled', 'sunny side up', 'poached', 'over easy'],\n",
" value='sunny side up',\n",
" description='I like my eggs ...',\n",
" disabled=False,\n",
" continuous_update=True,\n",
" orientation='horizontal',\n",
" readout=True\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### SelectionRangeSlider"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"source"
]
},
"outputs": [],
"source": [
"import datetime\n",
"dates = [datetime.date(2015,i,1) for i in range(1,13)]\n",
"options = [(i.strftime('%b'), i) for i in dates]"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.SelectionRangeSlider(\n",
" options=options,\n",
" index=(0,11),\n",
" description='Months (2015)',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Toggle Buttons"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.ToggleButtons(\n",
" options=['Slow', 'Regular', 'Fast'],\n",
" description='Speed:',\n",
" disabled=False,\n",
" button_style='', # 'success', 'info', 'warning', 'danger' or ''\n",
" tooltips=['Description of slow', 'Description of regular', 'Description of fast'],\n",
"# icons=['check'] * 3\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Select Multiple"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.SelectMultiple(\n",
" options=['Apples', 'Oranges', 'Pears'],\n",
" value=['Oranges'],\n",
" #rows=10,\n",
" description='Fruits',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# Page 2"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 1 - String widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Text"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Text(\n",
" value='Hello World',\n",
" placeholder='Type something',\n",
" description='String:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Text Area"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Textarea(\n",
" value='Hello World',\n",
" placeholder='Type something',\n",
" description='String:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Combobox"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Combobox(\n",
" # value='John',\n",
" placeholder='Choose Someone from: Paul, John, George, Ringo',\n",
" options=['Paul', 'John', 'George', 'Ringo'],\n",
" description='',\n",
" ensure_option=True,\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )\n"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Password"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Password(\n",
" value='password',\n",
" placeholder='Enter password',\n",
" description='Password:',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )\n"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 2 - String widgets"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Label"
]
},
{
"cell_type": "markdown",
"metadata": {
"tags": [
"body"
]
},
"source": [
"The Label widget is the one used in this dashboard to display the values of the other widgets."
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Label()\n",
"\n",
"control = widgets.Text(description=\"Control\", value=\"Some text...\")\n",
"widgets.link((control, 'value'), (widget, 'value'))\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, control, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### HTML"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.HTML(\n",
" value=\"Hello World\",\n",
" placeholder='Some HTML',\n",
" description='Some HTML',\n",
")\n",
"\n",
"control = widgets.Textarea(description=\"Control\", value=\"Hello World woooo\")\n",
"widgets.link((control, 'value'), (widget, 'value'))\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, control, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### HTML Math"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.HTMLMath(\n",
" value=r\"Some math and HTML: \\(x^2\\) and $$\\frac{x+1}{x-1}$$\",\n",
" placeholder='Some HTML',\n",
" description='Some HTML',\n",
")\n",
"\n",
"control = widgets.Textarea(description=\"Control\", value=\"Some math and HTML: \\(x^2\\) and $$\\frac{x+1}{x-1}$$\")\n",
"widgets.link((control, 'value'), (widget, 'value'))\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, control, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 3 - Other"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Image"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"url = 'https://upload.wikimedia.org/wikipedia/commons/thumb/3/38/Jupyter_logo.svg/883px-Jupyter_logo.svg.png'\n",
"widget = widgets.Image.from_url(url)\n",
"widget.width = \"100px\"\n",
"display(widget)\n"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Button"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widgets.Button(\n",
" description='Click me',\n",
" disabled=False,\n",
" button_style='', # 'success', 'info', 'warning', 'danger' or ''\n",
" tooltip='Click me',\n",
" icon='check' # (FontAwesome names without the `fa-` prefix)\n",
")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Play (Animation)"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.Play(\n",
" value=50,\n",
" min=0,\n",
" max=100,\n",
" step=1,\n",
" interval=100,\n",
" description=\"Press play\",\n",
" disabled=False\n",
")\n",
"\n",
"\n",
"value_lbl = widgets.IntSlider()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )\n"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 4 - Other"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Date picker"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.DatePicker(\n",
" description='Pick a Date',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Color Picker"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widget = widgets.ColorPicker(\n",
" concise=False,\n",
" description='Pick a color',\n",
" value='blue',\n",
" disabled=False\n",
")\n",
"\n",
"value_lbl = widgets.Label()\n",
"transform = lambda x: str(x)\n",
"widgets.dlink((widget, 'value'), (value_lbl, 'value'), transform)\n",
"\n",
"display(widget, widgets.HBox([widgets.Label(\"Current Value:\"), value_lbl]) )"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### File upload"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"widgets.FileUpload(\n",
" accept='', # Accepted file extension e.g. '.txt', '.pdf', 'image/*', 'image/*,.pdf'\n",
" multiple=False # True to accept multiple files upload else False\n",
")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# Layout"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 1"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Box "
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"items = [widgets.Label(str(i)) for i in range(4)]\n",
"widgets.Box(items)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### HBox"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"items = [widgets.Label(str(i)) for i in range(4)]\n",
"widgets.HBox(items)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### VBox"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"items = [widgets.Label(str(i)) for i in range(4)]\n",
"left_box = widgets.VBox([items[0], items[1]])\n",
"right_box = widgets.VBox([items[2], items[3]])\n",
"widgets.HBox([left_box, right_box])"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Grid Box"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"items = [widgets.Label(str(i)) for i in range(8)]\n",
"widgets.GridBox(items, layout=widgets.Layout(grid_template_columns=\"repeat(3, 100px)\"))"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Row 2"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"accordion = widgets.Accordion(children=[widgets.IntSlider(), widgets.Text()])\n",
"accordion.set_title(0, 'Slider')\n",
"accordion.set_title(1, 'Text')\n",
"accordion"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Tabs"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"tab_contents = ['P0', 'P1', 'P2', 'P3', 'P4']\n",
"children = [widgets.Text(description=name) for name in tab_contents]\n",
"tab = widgets.Tab()\n",
"tab.children = children\n",
"for i in range(len(children)):\n",
" tab.set_title(i, str(i))\n",
"tab"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Nesting tabs and accordions"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"tags": [
"body"
]
},
"outputs": [],
"source": [
"tab_nest = widgets.Tab()\n",
"tab_nest.children = [accordion, accordion]\n",
"tab_nest.set_title(0, 'An accordion')\n",
"tab_nest.set_title(1, 'Copy of the accordion')\n",
"tab_nest"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": []
}
],
"metadata": {
"celltoolbar": "Tags",
"kernelspec": {
"display_name": "Python 3",
"language": "python",
"name": "python3"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.7.6"
}
},
"nbformat": 4,
"nbformat_minor": 4
}