Skip to Content
Forui 0.12.0 is released 🎉
DocumentationOverlayDialog

Dialog

A modal dialog interrupts the user with important content and expects a response.

CLI

To generate and customize this style:

dart run forui style create dialog

Usage

FDialog(...)

FDialog( style: FDialogStyle(...), direction: Axis.horizontal, title: const Text('Are you absolutely sure?'), body: const Text('This action cannot be undone. This will permanently delete your account and remove your data from our servers.'), actions: [ FButton(style: FButtonStyle.outline, onPress: () => Navigator.of(context).pop(), child: const Text('Cancel')), FButton(onPress: () => Navigator.of(context).pop(), child: const Text('Continue')), ], );

FDialog.adaptive(...)

FDialog.adaptive( style: FDialogStyle(...), title: const Text('Are you absolutely sure?'), body: const Text('This action cannot be undone. This will permanently delete your account and remove your data from our servers.'), actions: [ FButton(style: FButtonStyle.outline, onPress: () => Navigator.of(context).pop(), child: const Text('Cancel')), FButton(onPress: () => Navigator.of(context).pop(), child: const Text('Continue')), ], );

FDialog.raw(...)

FDialog.raw( style: FDialogStyle(...), builder: (context, style) => const Placeholder(), );

Examples

Horizontal Layout

Vertical Layout

We recommend using the vertical layout on mobile devices.

Last updated on