ExpansionPanelList

A material expansion panel list that lays out its children and animates expansions.

Inherits: LayoutControl

Properties

• controls(list[ExpansionPanel]) –

  A list of ExpansionPanels to display inside ExpansionPanelList.

• divider_color(ColorValue | None) –

  The color of the divider when

• elevation(Number) –

  Defines the elevation of the children controls (ExpansionPanels), while it is

• expand_icon_color(ColorValue | None) –

  The color of the icon. Defaults to

• expanded_header_padding(PaddingValue) –

  Defines the padding around the header when expanded.

• spacing(Number | None) –

  The size of the gap between the ExpansionPanels when expanded.

Events

• on_change(ControlEventHandler[ExpansionPanelList] | None) –

  Called when an ExpansionPanel is expanded or collapsed. The event's data

Examples

Live example

Basic Example

import flet as ft


def main(page: ft.Page):
    page.theme_mode = ft.ThemeMode.LIGHT

    def handle_change(e: ft.Event[ft.ExpansionPanelList]):
        print(f"change on panel with index {e.data}")

    def handle_delete(e: ft.Event[ft.IconButton]):
        icon_button = e.control
        tile = icon_button.parent
        panel = tile.parent

        panel_list.controls.remove(panel)
        page.update()

    panel_list = ft.ExpansionPanelList(
        expand_icon_color=ft.Colors.AMBER,
        elevation=8,
        divider_color=ft.Colors.AMBER,
        on_change=handle_change,
        controls=[
            ft.ExpansionPanel(
                # has no header and content - placeholders will be used
                bgcolor=ft.Colors.BLUE_400,
                expanded=True,
            ),
        ],
    )

    colors = [
        ft.Colors.GREEN_500,
        ft.Colors.BLUE_800,
        ft.Colors.RED_800,
    ]

    for i in range(len(colors)):
        bgcolor = colors[i % len(colors)]
        panel_list.controls.append(
            ft.ExpansionPanel(
                bgcolor=bgcolor,
                header=ft.ListTile(title=ft.Text(f"Panel {i}"), bgcolor=bgcolor),
                content=ft.ListTile(
                    bgcolor=bgcolor,
                    title=ft.Text(f"This is in Panel {i}"),
                    subtitle=ft.Text(f"Press the icon to delete panel {i}"),
                    trailing=ft.IconButton(
                        icon=ft.Icons.DELETE,
                        on_click=handle_delete,
                    ),
                ),
            )
        )

    page.add(panel_list)


ft.run(main)

Properties

controls

controls: list[ExpansionPanel] = field(default_factory=list)

A list of ExpansionPanels to display inside ExpansionPanelList.

divider_color

divider_color: ColorValue | None = None

The color of the divider when ExpansionPanel.expanded is False.

elevation

elevation: Number = 2

Defines the elevation of the children controls (ExpansionPanels), while it is expanded. Default value is 2.

expand_icon_color

expand_icon_color: ColorValue | None = None

The color of the icon. Defaults to colors.BLACK_54 in light theme mode and colors.WHITE_60 in dark theme mode.

expanded_header_padding

expanded_header_padding: PaddingValue = field(
    default_factory=lambda: symmetric(vertical=16.0)
)

Defines the padding around the header when expanded.

spacing

spacing: Number | None = None

The size of the gap between the ExpansionPanels when expanded.

Events

on_change

on_change: (
    ControlEventHandler[ExpansionPanelList] | None
) = None

Called when an ExpansionPanel is expanded or collapsed. The event's data (e.data), contains the index of the ExpansionPanel which triggered this event.