AlertDialog

Can be used to inform the user about situations that require acknowledgement.

It has an optional title and an optional list of actions . The title is displayed above the content and the actions are displayed below the content.

ft.AlertDialog(
    title=ft.Text("Session expired"),
    content=ft.Text("Please sign in again to continue."),
    actions=[ft.TextButton("Dismiss")],
    open=True,
)

Basic AlertDialog

Inherits: DialogControl

Properties

• action_button_padding(PaddingValue | None) –

  The padding that surrounds each button in actions.

• actions(list[Control]) –

  A set of actions that are displayed at the bottom of this dialog.

• actions_alignment(MainAxisAlignment | None) –

  Defines the horizontal layout of the actions.

• actions_overflow_button_spacing(Number | None) –

  The spacing between actions when the OverflowBar

• actions_padding(PaddingValue | None) –

  Padding around the set of actions at the bottom of this dialog.

• alignment(Alignment | None) –

  How to align this dialog.

• barrier_color(ColorValue | None) –

  The color of the modal barrier that

• bgcolor(ColorValue | None) –

  The background color of this dialog's surface.

• clip_behavior(ClipBehavior) –

  Defines how the contents of this dialog are clipped (or not)

• content(Control | None) –

  The content of this dialog is displayed in the center of this dialog in a

• content_padding(PaddingValue | None) –

  Padding around the content.

• content_text_style(TextStyle | None) –

  The style for the text in the content of this dialog.

• elevation(Number | None) –

  Defines the elevation (z-coordinate) at which this dialog should appear.

• icon(Control | None) –

  A control that is displayed at the top of this dialog.

• icon_color(ColorValue | None) –

  The color for the Icon in the icon of this dialog.

• icon_padding(PaddingValue | None) –

  Padding around the icon.

• inset_padding(PaddingValue | None) –

  Padding around this dialog itself.

• modal(bool) –

  Whether dialog can be dismissed/closed by clicking the area outside of it.

• scrollable(bool) –

  Determines whether the title and

• semantics_label(str | None) –

  The semantic label of this dialog used by accessibility frameworks to announce

• shadow_color(ColorValue | None) –

  The color used to paint a drop shadow

• shape(OutlinedBorder | None) –

  The shape of this dialog.

• title(StrOrControl | None) –

  The title of this dialog is displayed in a large font at its top.

• title_padding(PaddingValue | None) –

  Padding around the title.

• title_text_style(TextStyle | None) –

  TBD

Examples

Live example

Modal and non-modal dialogs

import flet as ft


def main(page: ft.Page):
    page.title = "AlertDialog examples"

    dialog = ft.AlertDialog(
        title=ft.Text("Hello"),
        content=ft.Text("You are notified!"),
        alignment=ft.Alignment.CENTER,
        on_dismiss=lambda e: print("Dialog dismissed!"),
        title_padding=ft.Padding.all(25),
    )

    modal_dialog = ft.AlertDialog(
        modal=True,
        title=ft.Text("Please confirm"),
        content=ft.Text("Do you really want to delete all those files?"),
        actions=[
            ft.TextButton("Yes", on_click=lambda e: page.pop_dialog()),
            ft.TextButton("No", on_click=lambda e: page.pop_dialog()),
        ],
        actions_alignment=ft.MainAxisAlignment.END,
        on_dismiss=lambda e: print("Modal dialog dismissed!"),
    )

    page.add(
        ft.Button(
            content="Open dialog",
            on_click=lambda e: page.show_dialog(dialog),
        ),
        ft.Button(
            content="Open modal dialog",
            on_click=lambda e: page.show_dialog(modal_dialog),
        ),
    )


if __name__ == "__main__":
    ft.run(main)

Modal and non-modal dialogs

Properties

action_button_padding class-attribute instance-attribute

action_button_padding: PaddingValue | None = None

The padding that surrounds each button in actions.

actions class-attribute instance-attribute

actions: list[Control] = field(default_factory=list)

A set of actions that are displayed at the bottom of this dialog.

Typically this is a list of TextButton controls.

Raises:

• ValueError –

  If none of title, content, or actions are provided, as the dialog would have nothing to display.

actions_alignment class-attribute instance-attribute

actions_alignment: MainAxisAlignment | None = None

Defines the horizontal layout of the actions.

Internally defaults to MainAxisAlignment.END.

actions_overflow_button_spacing class-attribute instance-attribute

actions_overflow_button_spacing: Number | None = None

The spacing between actions when the OverflowBar switches to a column layout because the actions don't fit horizontally.

If the controls in actions do not fit into a single row, they are arranged into a column. This parameter provides additional vertical space between buttons when it does overflow.

actions_padding class-attribute instance-attribute

actions_padding: PaddingValue | None = None

Padding around the set of actions at the bottom of this dialog.

Typically used to provide padding to the button bar between the button bar and the edges of this dialog.

If are no actions, then no padding will be included. The padding around the button bar defaults to zero.

alignment class-attribute instance-attribute

alignment: Alignment | None = None

How to align this dialog.

If None, then DialogTheme.alignment is used. If that is also None, the default is Alignment.CENTER.

barrier_color class-attribute instance-attribute

barrier_color: ColorValue | None = None

The color of the modal barrier that darkens everything below this dialog.

If None, then DialogTheme.barrier_color is used. If that is also None, the default is Colors.BLACK_54.

bgcolor class-attribute instance-attribute

bgcolor: ColorValue | None = None

The background color of this dialog's surface.

clip_behavior class-attribute instance-attribute

clip_behavior: ClipBehavior = NONE

Defines how the contents of this dialog are clipped (or not) to the given shape.

content class-attribute instance-attribute

content: Control | None = None

The content of this dialog is displayed in the center of this dialog in a lighter font.

Typically this is a Column that contains this dialog's Text message.

content_padding class-attribute instance-attribute

content_padding: PaddingValue | None = None

Padding around the content.

If there is no content, no padding will be provided. Otherwise, padding of 20 pixels is provided above the content to separate the content from the title, and padding of 24 pixels is provided on the left, right, and bottom to separate the content from the other edges of this dialog.

content_text_style class-attribute instance-attribute

content_text_style: TextStyle | None = None

The style for the text in the content of this dialog.

If None, DialogTheme.content_text_style is used. If that's is also None, defaults to TextTheme.body_medium (if Theme.use_material3 is True; TextTheme.title_medium otherwise) of Theme.text_theme.

elevation class-attribute instance-attribute

elevation: Number | None = None

Defines the elevation (z-coordinate) at which this dialog should appear.

icon class-attribute instance-attribute

icon: Control | None = None

A control that is displayed at the top of this dialog.

Typically a Icon control.

icon_color class-attribute instance-attribute

icon_color: ColorValue | None = None

The color for the Icon in the icon of this dialog.

If None, DialogTheme.icon_color is used. If that is null, defaults to color scheme's ColorScheme.secondary if Theme.use_material3 is True, Colors.BLACK otherwise.

icon_padding class-attribute instance-attribute

icon_padding: PaddingValue | None = None

Padding around the icon.

inset_padding class-attribute instance-attribute

inset_padding: PaddingValue | None = None

Padding around this dialog itself.

Defaults to Padding.symmetric(vertical=40, horizontal=24) - 40 pixels horizontally and 24 pixels vertically outside of this dialog box.

modal class-attribute instance-attribute

modal: bool = False

Whether dialog can be dismissed/closed by clicking the area outside of it.

scrollable class-attribute instance-attribute

scrollable: bool = False

Determines whether the title and content controls are wrapped in a scrollable.

This configuration is used when the title and content are expected to overflow. Both title and content are wrapped in a scroll view, allowing all overflowed content to be visible while still showing the button bar.

semantics_label class-attribute instance-attribute

semantics_label: str | None = None

The semantic label of this dialog used by accessibility frameworks to announce screen transitions when this dialog is opened and closed.

On iOS, if this label is not provided, a semantic label will be inferred from the title if it is not None.

shadow_color class-attribute instance-attribute

shadow_color: ColorValue | None = None

The color used to paint a drop shadow under this dialog, which reflects this dialog's elevation.

shape class-attribute instance-attribute

shape: OutlinedBorder | None = None

The shape of this dialog.

If None, defaults to DialogTheme.shape. If it is also None, it defaults to RoundedRectangleBorder(radius=4.0).

title class-attribute instance-attribute

title: StrOrControl | None = None

The title of this dialog is displayed in a large font at its top.

Typically a Text control.

title_padding class-attribute instance-attribute

title_padding: PaddingValue | None = None

Padding around the title.

If there is no title, no padding will be provided. Otherwise, this padding is used.

Defaults to 24 pixels on the top, left, and right of the title. If the content is not None, then no bottom padding is provided (see content_padding). If it is not set, then an extra 20 pixels of bottom padding is added to separate the title from the actions.

title_text_style class-attribute instance-attribute

title_text_style: TextStyle | None = None

TBD