Dialogs

An alert on glass, and the presenter that animates it in.

Two widgets and one presenter. LiquidGlassAlertDialog has the Material 3 slots you already know — icon, title, content, actions — sitting on a glass lens instead of a filled surface. LiquidGlassDialog is the same card with nothing in it but your own child.

Dart

showLiquidGlassDialog(
  context: context,
  builder: (context) => LiquidGlassAlertDialog(
    icon: const Icon(Icons.delete_outline_rounded),
    title: const Text('Delete this album?'),
    content: const Text('The photos in it stay in your library.'),
    actions: [
      LiquidGlassButton(label: 'Cancel', onPressed: () => pop(context)),
      LiquidGlassButton(label: 'Delete', onPressed: () => confirm(context)),
    ],
  ),
);

showLiquidGlassDialog is showGeneralDialog with a tuned scale-and-fade transition already set: transitionDuration, transitionCurve and reverseTransitionCurve are yours to change, and barrierDismissible, barrierColor, useRootNavigator, routeSettings and the rest behave exactly as Flutter's do.

The slots#

Parameter	Default	What it does
`icon` / `iconColor`	`null`	A leading glyph above the title.
`title` / `content`	`null`	The two text slots, each with its own padding and text style.
`actions`	`null`	The button row. It overflows to a column when the buttons do not fit, with `actionsOverflow*` controlling how.
`width`	`340`	Maximum width of the card.
`scrollable`	`false`	Lets a long title and content scroll instead of overflowing.
`style`	`null`	The glass, same as everywhere else.

Comments

Comments are GitHub Discussions — reply from either place.