Flet应用中正确显示AlertDialog模态对话框的指南

await e.page.show_dialog_async(dialog_instance)

import flet as ft

class TodoApp(ft.UserControl):
    def build(self):
        return ft.Column(
            controls=[
                ft.Row(
                    [
                        ft.ElevatedButton(text="显示模态对话框", on_click=self.show_alert_dialog),
                    ],
                    alignment=ft.MainAxisAlignment.CENTER,
                ),
            ],
        )

    async def show_alert_dialog(self, e: ft.ControlEvent):
        """
        点击按钮时显示AlertDialog
        """
        # 步骤一：定义AlertDialog实例
        dlg_modal = ft.AlertDialog(
            modal=True, # 建议设置为模态对话框，阻止与背景交互
            title=ft.Text("用户登录提示"),
            content=ft.Text("您确定要继续登录操作吗？此操作不可逆。"),
            actions=[
                ft.TextButton("取消", on_click=self.close_dlg),
                ft.ElevatedButton("确认", on_click=self.confirm_dlg),
            ],
            actions_alignment=ft.MainAxisAlignment.END,
            on_dismiss=lambda _: print("对话框被用户点击外部或ESC键关闭了！"), # 对话框非通过按钮关闭时的回调
        )

        # 将对话框实例存储在页面的dialog属性上，方便后续在其他函数中访问和关闭
        e.page.dialog = dlg_modal

        # 步骤二：调用page.show_dialog_async显示对话框
        await e.page.show_dialog_async(dlg_modal)
        print("对话框已尝试显示。")

    async def close_dlg(self, e: ft.ControlEvent):
        """
        处理对话框中“取消”按钮的点击事件，关闭对话框
        """
        if e.page.dialog:
            e.page.dialog.open = False # 设置open属性为False
            await e.page.update_async() # 更新页面以关闭对话框
            print("用户点击了取消按钮，对话框已关闭。")

    async def confirm_dlg(self, e: ft.ControlEvent):
        """
        处理对话框中“确认”按钮的点击事件，执行确认逻辑并关闭对话框
        """
        if e.page.dialog:
            e.page.dialog.open = False # 设置open属性为False
            await e.page.update_async() # 更新页面以关闭对话框
            print("用户点击了确认按钮，执行登录逻辑...对话框已关闭。")
            # 这里可以添加实际的登录或其他确认操作逻辑

async def main(page: ft.Page):
    page.title = "Flet AlertDialog 正确显示示例"
    page.vertical_alignment = ft.CrossAxisAlignment.CENTER
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
    page.window_width = 400
    page.window_height = 300

    await page.add_async(TodoApp())

if __name__ == "__main__":
    ft.app(target=main)