Skip to content

🎯  Radial Menu

Submitted by Debbie Matthews

Summary

A circular menu component that displays options in a ring around a central button.

Functions

radial_menu

Display a radial menu with the given options.

Parameters:

Name Type Description Default
options dict[str, str]

A dictionary mapping option values to their display icons/emojis. Example: {"home": "🏠", "search": "🔍", "settings": "⚙️"}

 required
default str | None

The default selected option. If None, uses the first option.

 None
key str

A unique key for this component instance.

 'radial_menu'

Returns:

Type Description
RadialMenuState

A TypedDict with a "selection" key containing the currently selected option value.

Example:

```python
result = radial_menu({"home": "🏠", "search": "🔍", "settings": "⚙️"})
st.write(f"Selected: {result['selection']}")
```
Source code in src/streamlit_extras/radial_menu/__init__.py 
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
@extra
def radial_menu(
    options: dict[str, str],
    *,
    default: str | None = None,
    key: str = "radial_menu",
) -> RadialMenuState:
    """Display a radial menu with the given options.

    Args:
        options: A dictionary mapping option values to their display icons/emojis.
            Example: {"home": "🏠", "search": "🔍", "settings": "⚙️"}
        default: The default selected option. If None, uses the first option.
        key: A unique key for this component instance.

    Returns:
        A TypedDict with a "selection" key containing the currently selected option value.

    Example:

        ```python
        result = radial_menu({"home": "🏠", "search": "🔍", "settings": "⚙️"})
        st.write(f"Selected: {result['selection']}")
        ```
    """
    if default is None:
        default = next(iter(options.keys()), None)

    return _COMPONENT(
        key=key,
        data={"options": options, "selection": default},
        default={"selection": default},
        on_selection_change=lambda: None,
    )

Import:

from streamlit_extras.radial_menu import radial_menu # (1)!
  1. You should add this to the top of your .py file 🛠

Examples

example

def example() -> None:
    """Example usage of the radial menu component."""
    import streamlit as st

    st.write("Click the button below to open the radial menu:")

    result = radial_menu(
        options={
            "home": "🏠",
            "search": "🔍",
            "settings": "⚙️",
            "profile": "👤",
            "help": "❓",
        },
        key="demo_menu",
    )

    st.write(f"**Selected:** `{result['selection']}`")