0

I have a PopupMenuButton, and after opening that I want the background to be blurred or darken such that focus will be on the newly opened menu.

return Scaffold(
 appbar: AppBar(
  //....
  leading: BackdropFilter(
            filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
            child: PopupMenuButton<String>(
              color: kLightGreen,
              offset: Offset(30, 30),
              icon: Icon(
                Icons.sort,
                color: kLightestGreen,
              ),
              onSelected: choiceAction,
              itemBuilder: (BuildContext context) {
                return Constants.choices.map((String choice) {
                  return PopupMenuItem<String>(
                    value: choice,
                    child: Text(
                      choice,
                      textAlign: TextAlign.left,
                      style: TextStyle(color: Colors.white),
                    ),
                  );
                }).toList();
              },
            ),
          ),
 //...
 )
)

Before opening menu After opening menu

  • 1
    I don't think popup menu were design to have this feature. I believe you got 2 option to do that. 1/ Create your own custom popup menu either by taping into original copy it and modify it to your needs or create one from scratch 2/Find some popup menu package with this feature. – LonelyWolf May 14 '20 at 18:04
  • Can you give a hint on how can I structure the custom widget, I mean what all inbuilt widget I need to use? – Sarthak Brahma May 14 '20 at 19:27
  • have you figured out how to blur or darken the background when the popupmenu is open? – Steinhammer71 Mar 08 '22 at 08:01
  • https://stackoverflow.com/a/68651711/10264008 – Ali Izadyar Jun 01 '22 at 09:36

0 Answers0