RadioBoxGroup#
Download this notebook from GitHub (right-click to download).
import panel as pn
import panel_material_ui as pmui
pn.extension()
The RadioBoxGroup
widget allows selecting from a list or dictionary of values using a set of checkboxes. It falls into the broad category of single-value, option-selection widgets that provide a compatible API and include the RadioButtonGroup
, Select
and DiscreteSlider
widgets.
Discover more on using widgets to add interactivity to your applications in the how-to guides on interactivity. Alternatively, learn how to set up callbacks and (JS-)links between parameters or how to use them as part of declarative UIs with Param.
Parameters:#
For details on other options for customizing the component see the customization guides.
Core#
disabled
(boolean): Whether the widget is editableoptions
(list or dict): A list or dictionary of options to select fromvalue
(object): The current value; must be one of the option values
Display#
color
(str): A color variant; should be one of'default'
(white),'primary'
(blue),'success'
(green),'info'
(yellow),'light'
(light), or'danger'
(red).inline
(boolean): Whether to arrange the items vertically in a column (False
) or horizontally in a line (True
)label
(str): The title of the widget
Styling#
sx
(dict): Component level styling API.theme_config
(dict): Theming API.
Aliases#
For compatibility with Panel certain parameters are allowed as aliases:
button_style
: Alias forvariant
button_type
: Alias forcolor
name
: Alias forlabel
radio_group = pmui.RadioBoxGroup(label='RadioBoxGroup', options=['Biology', 'Chemistry', 'Physics'], inline=True)
radio_group
Like most other widgets, RadioBoxGroup
has a value parameter that can be accessed or set:
radio_group.value
Dictionary Options#
You can provide options as a dictionary where keys are the displayed labels and values are the actual option values:
dict_group = pmui.RadioBoxGroup(
label='Radiobox Group', value=['A', 'P'], options={'Apple': 'A', 'Banana': 'B', 'Pear': 'P', 'Strawberry': 'S'},
inline=True,
)
dict_group
Let’s observe how the value
parameter reflects the selected dictionary values (not the labels):
pn.pane.Str(dict_group.param.value)
Orientation#
Control the layout of checkboxes using the inline
parameter:
pmui.Column(
pmui.RadioBoxGroup(label='Horizontal', value='Apple', options=['Apple', 'Banana', 'Pear', 'Strawberry'], inline=True),
pmui.RadioBoxGroup(label='Vertical', value='Banana', options=['Apple', 'Banana', 'Pear', 'Strawberry'], inline=False)
)
Label Placement#
You may provide a label_placement
as one of “bottom”, “start”, “top”, “end”:
pmui.FlexBox(
*(pmui.RadioBoxGroup(
label=lp, label_placement=lp, inline=True, value='Apple', options=['Apple', 'Banana']
) for lp in pmui.RadioBoxGroup.param.label_placement.objects)
)
Color Options#
Customize the appearance of checkboxes using the color
parameter:
pmui.FlexBox(
*(pmui.RadioBoxGroup(
label=color, color=color, inline=True, value='Apple', options=['Apple', 'Banana']
) for color in pmui.RadioBoxGroup.param.color.objects)
)
Disabled and Loading States#
Like other widgets, RadioBoxGroup
can be disabled and/or show a loading indicator.
pmui.RadioBoxGroup(
label='Radiobox Group', value='Pear', options=['Apple', 'Banana', 'Pear', 'Strawberry'],
disabled=True, loading=True
)
Example: Interactive Pizza Order Form#
Let’s create a practical example showing how RadioBoxGroup
can be used in a real application. This pizza ordering interface demonstrates real-time updates based on user selections:
import panel as pn
import panel_material_ui as pmui
pn.extension()
pizza = pmui.RadioBoxGroup(
label="Select your Pizza:",
options=['Pepperoni', 'Margharita', 'Fior di Late', 'Hawaii'],
value='Pepperoni',
inline=True,
)
def create_order_summary(topping):
summary = f"## 🧺 Your Pizza Order\n\n"
summary += f"Type: {topping}\n"
total = 12.99 + (99 if topping == 'Hawaii' else 0)
summary += f"\n**Total: ${total:.2f}**"
return summary
order_summary = pn.bind(create_order_summary, topping=pizza)
pmui.Column(
"## 🍕 Pizza Order Form",
pizza,
"---",
order_summary,
width=800
)
API Reference#
Parameters#
pmui.RadioBoxGroup(
label='Radiobox Group', value=['Apple', 'Pear'], options=['Apple', 'Banana', 'Pear', 'Strawberry'],
).api(jslink=True)
References#
Discover more on using widgets to add interactivity to your applications in the how-to guides on interactivity.
Learn how to set up callbacks and (JS-)links between parameters or how to use them as part of declarative UIs with Param.
See also the Material UI Radiobox
Reference for inspiration.
pmui.Row(radio_group.controls(jslink=True), radio_group)
Download this notebook from GitHub (right-click to download).