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
widget that is a descendant of a FToaster
or FScaffold
widget.
Preview
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
Preview
Raw
Preview
Behavior
Always Expanded
Preview
Expansion Disabled
Preview
Swipe to Dismiss
By default, toasts are dismissible by horizontally swiping towards the closest edge of the screen.
Down
Preview
Disabled
Preview
Last updated on