We don’t want our users to Accidentally close our App. So, Confirmation Popups are a common feature in any Mobile App. We have a widget in Flutter for doing this.

In Flutter, we have a widget Named WillPopScope. We just have to wrap our Page in this widget and provide a function to its onWillPop argument. It will be triggered when the user tries to close the current route. The onWillPop will accept a Future<bool> Function. If that function returns false, the current Route will not be popped.

For Example, passing the below Function to onWillPop will bring up a Dialog with Exit confirmation.

 Future<bool> _onWillPop() async {
    return (await showDialog(
          context: context,
          builder: (context) => AlertDialog(
            title: Text('Are you sure?'),
            content Text('Do you want to exit the App'),
            actions: <Widget>[
              TextButton(
                onPressed: () => Navigator.of(context).pop(false),
                child: Text('No'),
              ),
              TextButton(
                onPressed: () => Navigator.of(context).pop(true),
                child: Text('Yes'),
              ),
            ],
          ),
        )) ??
        false;
  }

As you can see, Clicking the Yes Button will Close our App. And Clicking the No Button will Close the Popup only.

I think you found something useful here.

Let me know your suggestions and opinions in Twitter or drop a mail a [email protected].

If you’re feeling too generous, you can support me through Buy Me a Coffee.

Finally, if you found this helpful, please share this within your reach so that more people can benefit from this. And Follow me on Twitter for getting more posts like these 😉.