Navigator.of(context).pop(); makes the whole screen disappear, not the popup

Question

In my flutter app I want to show the popup with two buttons when user presses a button, I'm doing it with the following code:

class ProfileScreen extends StatefulWidget {
  @override
  _ProfileScreenState createState() {
    return _ProfileScreenState();
  }
}

class _ProfileScreenState extends State<ProfileScreen> {

@override
Widget build(BuildContext context) {
return Scaffold(
    body: SingleChildScrollView(
        padding: EdgeInsets.all(16),
        child: ConstrainedBox(
            constraints: BoxConstraints(maxWidth: 400),
            child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  ...[
Padding(
    padding: const EdgeInsets.symmetric(vertical: 16.0),
    child: ElevatedButton(
      onPressed: () {
        showAlertDialog(context);
      },
    child: Text('Remove account'),
    ),
    ),

and the code for showAlertDialog is as follows:

showAlertDialog(BuildContext context) {
    // set up the buttons
    Widget cancelButton = FlatButton(
      child: Text("Cancel"),
      onPressed:  () {

        Navigator.of(context).pop();
      },
    );
    Widget continueButton = FlatButton(
      child: Text("Continue"),
      onPressed:  () {},
    );
    // set up the AlertDialog
    AlertDialog alert = AlertDialog(
      title: Text("AlertDialog"),
      content: Text("Would you like to continue learning how to use Flutter alerts?"),
      actions: [
        cancelButton,
        continueButton,
      ],
    );
    // show the dialog
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return alert;
      },
    );
  }

It works, the popup shows correctly, but when I click cancel, popup stays up front, but the screen beneath it goes away (and it stays black). Why so? And how could I fix it? Thanks!

Answer 1

Navigator.of(context, rootNavigator: true).pop();