Skip to Content
Forui 0.17.0 is released 🎉

Toast

An opinionated toast that temporarily displays a succinct message.

To show a toast, use the showFToast(...) or showRawFToast(...) functions. The function must be called from a descendant of a FToaster.

We recommend placing FToaster in the builder method of MaterialApp/WidgetsApp/CupertinoApp:

MaterialApp( builder: (context, child) => FAnimatedTheme( data: FThemes.zinc.light, child: FToaster(child: child!), ), home: HomePage(), );

CLI

To generate and customize this style:

dart run forui style create toast

Usage

showFToast(...)

showRawFToast( context: context, style: FToastStyle(...), alignment: FToastAlignment.topRight, swipeToDismiss: [AxisDirection.left, AxisDirection.down], duration: const Duration(seconds: 10), onDismiss: () {}, icon: const Icon(FIcons.triangleAlert), title: const Text('Download Complete'), description: const Text('Your file has been downloaded.'), suffix: FButton( onPress: () => entry.dismiss(), child: const Text('Undo'), ), showDismissButton: true, onDismiss: () {}, );

showRawFToast(...)

showRawFToast( context: context, style: FToastStyle(...), alignment: FToastAlignment.topRight, swipeToDismiss: [AxisDirection.left, AxisDirection.down], duration: const Duration(seconds: 10), onDismiss: () {}, builder: (context, entry) => FCard( title: Text('Download Complete'), subtitle: Column( crossAxisAlignment: CrossAxisAlignment.start, spacing: 10, children: [ Text('Your file has been downloaded.'), FButton( onPress: () => entry.dismiss(), child: const Text('Dismiss'), ), ], ), ), );

Examples

Appearance

No Auto-Dismiss

Raw

Behavior

Always Expanded

Expansion Disabled

Swipe to Dismiss

Default

By default, toasts are dismissible by horizontally swiping towards the closest edge of the screen.

Down

Disabled

Last updated on