CODEWITHSUNDEEP
dartflutter
user6274128
user6274128

Reputation:

Remove padding from PopupMenuItem (overflow menu)

How to remove this 16 dp of padding from the PopupMenuItem? enter image description here

This is my list of PopupMenuItem

PopupMenuItem(
  child: Text("Hello"),
  value: 0,
),
PopupMenuItem(
  child: Text("Remove padding"),
  value: 1,
),

Upvotes: 14

Views: 11417

Answers (4)

Srikanth
Srikanth

Reputation: 2114

Not sure if flutter did not have the height property on PopupMenuItem before, but now it does. And setting it to zero removes that vertical padding.

PopupMenuButton(padding: EdgeInsets.zero, itemBuilder: (context) => [
  PopupMenuItem(height: 0, padding: EdgeInsets.zero, child: Text('World')),
  PopupMenuItem(height: 0, padding: EdgeInsets.zero, child: Text('Of')),
  PopupMenuItem(height: 0, padding: EdgeInsets.zero, child: Text('Warcraft'))
])

The above code sample removes all sorts of padding from menu items.

Upvotes: 6

AlexPad
AlexPad

Reputation: 10879

enter image description here

In my case I had to remove the fixed padding of 8 which moves all my components to the side and is not nice. For this I have created a workaround that works in my case. As I am working on a Row, this was enough for me:

ConstrainedBox constrainedBoxPopup =  new ConstrainedBox(
      constraints: new BoxConstraints(
        maxHeight: 30.0,
        maxWidth: 30.0,
     ),
      child: popupMenuButton,
  );

As you can see I have forced a maximum height and width in a ConstrainedBox. In fact, the padding has no effect on it now.

Upvotes: 3

user6274128
user6274128

Reputation:

I don't like it but this is the only solution that worked for me. I had to edit non project files (PopupMenuItem class)

return InkWell(
      onTap: widget.enabled ? handleTap : null,
      child: Container(
        height: widget.height,
        padding: const EdgeInsets.symmetric(horizontal: _kMenuHorizontalPadding), // setting this to 0 worked 
        child: item,
      ),
    );

PS: I hope someone will come up with better answer. And I will be glad to accept it. Thanks :)

Upvotes: 6

soupjake
soupjake

Reputation: 3449

Your PopupMenuItems should be within a PopupMenuButton widget which has a padding property set to 8dp by default. Try changing that value to what you want.

Upvotes: 0

Related Questions