Home > Software design >  Alert Dialogue is not showing on popup item click. Any solution?
Alert Dialogue is not showing on popup item click. Any solution?

Time:12-14

Here is my PopupMenuButton

                        PopupMenuButton(
                            icon:
                                Icon(Icons.more_vert, color: Colors.white),
                            itemBuilder: (context) => [
                                  PopupMenuItem(
                                    onTap: () {
                                      showMyDialog();
                                    },
                                    child: Text(
                                      "Edit Profile Picture",
                                      style: TextStyle(
                                          color: AppColors.pinkColor),
                                    ),
                                    value: 1,
                                  ),
                                  PopupMenuItem(
                                   
                                    child: Text(
                                      "Edit  Cover Picture",
                                      style: TextStyle(
                                          color: AppColors.pinkColor),
                                    ),
                                    value: 2,
                                  ),
                                  PopupMenuItem(
                                  
                                    child: Text(
                                      "Setting",
                                      style: TextStyle(
                                          color: AppColors.pinkColor),
                                    ),
                                    value: 3,
                                  )
                                ])

And this is my Dilaogue function

Future<void> _showMyDialog() async {
    return showDialog<void>(
      context: context,
      barrierDismissible: false, // user must tap button!
      builder: (BuildContext context) {
        return AlertDialog(
          title: const Text('AlertDialog Title'),
          content: SingleChildScrollView(
            child: ListBody(
              children: const <Widget>[
                Text('This is a demo alert dialog.'),
                Text('Would you like to approve of this message?'),
              ],
            ),
          ),
          actions: <Widget>[
            TextButton(
              child: const Text('Approve'),
              onPressed: () {
                Navigator.of(context).pop();
              },
            ),
          ],
        );
      },
    );
  }

CodePudding user response:

onTap of PopupMenuItem call Navigator.pop after tapping on any item on PopupMenuButton to close it.

 void handleTap() {
    widget.onTap?.call();

    Navigator.pop<T>(context, widget.value);
  }

When you tap the item it shows _showMyDialog() but close it immediately because of Navigator.pop called and that's why you can find PopupMenuItem is open after tap.

Simply Navigator.pop is closing the showDialog instead of PopupMenuButton's items. We can provide some delay to close the PopupMenuItem then can call _showMyDialog();

PopupMenuItem(
  onTap: () {
    Future.delayed(Duration.zero).then((value) {
      _showMyDialog();
    });
  },

CodePudding user response:

Let's say that if you've declared function as _showMyDialogue(), then you should use _showMyDialogue() when calling that function. In your case, you Ignored "_" while calling it. That's the problem.

  • Related