Flutter PopupMenuButton - don't close the menu when selected

Viewed 523

I have a list of checkbox items (PopupMenuItem) inside my popup menu, which is triggered by a popupMenuButton. I want the user to be able to select a number of checkboxes, but as soon as one item is selected it closes the window.

Is there any way to prevent this? I need it to stay open, or alternatively force it open again immediately.

(I tried creating my own PopupItem class to override the "handleTap()", but I need to update the state of the parent menu view, which I can't call from another class. So Ive removed that again.)

class TopicsNotificationMenu extends StatefulWidget {

  List<Topic> topics = [];

  TopicsNotificationMenu(this.topics);

  @override
  _TopicsNotificationMenuState createState() => 
  _TopicsNotificationMenuState();


}

class _TopicsNotificationMenuState extends State<TopicsNotificationMenu> {

  _TopicsNotificationMenuState();
  
  _updateTopics(_tp){

      setState(() {
          if(_tp.value == true){
            _tp.value = false;
          }else{
            _tp.value = true;
            _registerTopic(_tp.name);
         }
      });
  }

  @override
  Widget build(BuildContext context) {


     return PopupMenuButton(
      onSelected: (value) {
        _updateTopics(value);    
      },
      itemBuilder: (BuildContext context) {  
        return widget.topics.map((var tp) {
            var _icon = (tp.value == true) ? Icons.check_box : Icons.check_box_outline_blank;
            return PopupMenuItem(
                  value: tp,
                  child: ListTile(
                    leading: Icon(_icon),
                    title: Text(tp.name),
                  ),
                );
        }).toList();
    });

 }
2 Answers

You can try to reopen it each time after the user's selection. I made an example here

Alternatively, I would advise creating your own widget with the desired behaviour.

I had to create my own widget for this. In summary, I wanted a floating list in the top-right of my screen with a list of checkboxed items. When I press the items they become checked/unchecked but the window remains open until I click off it. I used the following widget tree:

 An OverlayEntry widget so that I could place it anywhere floating above the app

   -> added the SafeArea widget so that my padding would include the notification bar at the top of the phone

     -> a Gesture Detector, so that on tapping off it I could close it

       -> a column with CrossAxisAlignment.end so that it was placed in the top-right

         -> a container widget with some padding
    
           -> a Material for elevation shading and to contain a list

             -> The Listview

               -> The List Tiles with icon and Text for each item. The icon was either the ticked or unticked graphic, depending on it's value (which is stored as a boolean in an array)

onTap of a ListTile it updated the state of the widget and dispayed it again. There is no visual blinking, it is instant. onTap of the Gesture Detector it simply removes the widget.

Related