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 editable

  • options (list or dict): A list or dictionary of options to select from

  • value (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 for variant

  • button_type: Alias for color

  • name: Alias for label


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
Biology

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).