overlay_dialog

Description:

overlay dialog

OverlayDialog #
A Flutter package for showing platform dialogs without using new routes.

No confusing navigation - dialog added to the current route
Supports Material and Cupertino dialogs
Flutter-based solution, no additional imports needed

What's the problem? #
During project develop we stucks with several problems with Flutter dialogs. This package solves several problems of standart Flutter approach.

Flutter creates a new route when adding dialogs with showDialog<T>. It causes problems in case when app handles lifecycle (route) events and relies on calls look like ModalRoute.of(context).isCurrent. Actually Dialog route becomes active and page route goes background.
showDialog<T> call is asynchronous, there is no straight-forward way to detect if it is really opened. If app needs to open / close several dialogs rapidly, the synchronization mechanism would be tricky.
Dialog shares the same navigator with app pages and can't be named. Navigator.of(context).pop() closes the dialog or the page, which may be confusing.

OverlayDialog solves these problems by adding dialog to route overlay, so app navigation and lifecycle becomes easier.
Features #

OverlayDialog uses Flutter dialogs under the cover, so widgets UI is the same. Material and Cupertino alert and progress dialogs are available. Dialog style is set via App theme.
OverlayDialog adds dialog to the route overlay without new route creating. This makes lifecycle and navigation calls clearly.
OverlayDialog follows design guidelines and handles back press for android devices (this may be disabled if needed). It animates dialog appear and disappear to follow native design.
DialogHelper consolidates all logic for show / hide actions. Previously opened dialogs closes automatically when new dialog added.

Usage #
For a complete usage, please see the example.
Alert Dialog instance is created by call DialogWidget.alert(...). Additional flags may be set for DialogAction to highlight Cupertino buttons. These settings doesn't make sense for Material dialogs. Alert dialog is closable by default, this option may be disabled by setting closable parameter.
DialogWidget.alert(
closable: true,
style: DialogStyle.material,
title: "Title",
content: "Content",
actions: [
DialogAction(
title: "Button One",
handler: buttonOneHandler,
isDestructive: true,
),
DialogAction(
title: "Button Two",
handler: buttonTwoHandler,
isDefault: true,
),
],
)
copied to clipboard
Progress dialog isn't closable by default and shows circular spinner.
DialogWidget.progress(
style: DialogStyle.material
)
copied to clipboard
Custom dialog allows to show any widget on gray-out layout.
DialogWidget.custom(
child: widget
)
copied to clipboard
DialogHelper() uses to show and hide dialogs. This is singleton instanse so it is no need to keep it inside app variables.
DialogHelper().show(
context,
widget,
)
copied to clipboard
Dialog Theme #
Dialog customization may be achieved via app theme setup.
ThemeData(
brightness: Brightness.light, // Light or Dark theme
accentColor: Colors.red,
buttonTheme: ButtonThemeData(
textTheme: ButtonTextTheme.accent,
),
buttonBarTheme: ButtonBarThemeData(
buttonTextTheme: ButtonTextTheme.accent, // Button style
alignment: MainAxisAlignment.end, // Button position
),
dialogTheme: DialogTheme(
backgroundColor: Colors.blue, // Dialog background
titleTextStyle: TextStyle(color: Colors.green), // Title style
contentTextStyle: TextStyle(color: Colors.purple), // Content style
)
)
copied to clipboard
Development #
This package is actively developed alongside production apps, and the API will change as we continue our way to version 1.0.
Please be fully prepared to deal with breaking changes.
Contributing #
Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.
Contributors/People #
Anastasia Artemyeva ([email protected])
Todos #

Add input dialogs
Add custom animation
Add tests

License #
Apache License, Version 2.0
Free Software, Hell Yeah!