How to show and Dismiss Dialogs In Flutter?
When a user needs to perform some operation on data from the mobile application. Users need to get permission that may ask the user to confirm the action. So once the user is displayed a DialogBox it needs to dismiss after getting confirmation. So in this article, we will go through How to Show and Dismiss Dialog In Flutter?
Also, go through what is Dismissible Widget in Flutter?
Tips to Show and Dismiss Dialog In Flutter
To Dismiss Dialog user needs to make use of an inbuilt class like showDialog.
The dialog route created by this method is pushed to the root navigator.
If the application has multiple Navigator objects.
It may be necessary to call Navigator.of(context, rootNavigator: true).pop(result) to close the dialog rather just Navigator.pop(context, result).
Consider a code snippet like below:
late BuildContext dialogContext;// global declaration
showDialog(
context: context,
barrierDismissible: false,
builder: (BuildContext context) {
dialogContext = context;
return Dialog(
child: new Row(
mainAxisSize: MainAxisSize.min,
children: [
new CircularProgressIndicator(),
new Text("Loading"),
],
),
);
},
);
await _longOperation();// asynchronous operation
Navigator.pop(dialogContext);// pop dialog with use of Dialog context
If you don’t want to return any result after showDialog is closed, you can use it.
Navigator.pop(context);
If you want to pass the result call.
Navigator.pop(context, result);
An example will have a code snippet like the below:
showDialog(
context: context,
builder: (_) {
return AlertDialog(
title: Text('Wanna Exit?'),
actions: [
TextButton(
onPressed: () => Navigator.pop(context, false), // passing false
child: Text('No'),
),
TextButton(
onPressed: () => Navigator.pop(context, true), // passing true
child: Text('Yes'),
),
],
);
}).then((exit) {
if (exit == null) return;
if (exit) {
// user pressed Yes button
} else {
// user pressed No button
}
});
The below code will close AlertBox/DialogBox in Flutter.
Navigator.of(context).pop();
Conclusion:
In this article, We have been through How to Show and Dismiss Dialog In Flutter?
Keep Learning !!! Keep Fluttering !!!
Do check the article on Dismissible Widget.
Still, need Support for Flutter Development? Do let us know.
FlutterAgency.com is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget Guide, Flutter Projects, Code libs and etc.
FlutterAgency.com is one of the most popular online portals dedicated to Flutter Technology and daily thousands of unique visitors come to this portal to enhance their knowledge of Flutter.
