如何移除Flutter中showMenu组件最顶部的边距？

你遇到的顶部空白边距，不是PopupMenuItem的内边距，而是showMenu默认的菜单容器自带的padding。直接给showMenu加上自定义menuStyle就能解决：

方法一：规范移除边距（推荐） #

修改showMenu的menuStyle参数，把菜单容器的padding设为EdgeInsets.zero，同时将原来PopupMenuItem里的圆角移到菜单整体上，避免圆角失效：

showMenu(
  context: context,
  position: position,
  // 自定义菜单样式，移除顶部边距
  menuStyle: MenuStyle(
    padding: MaterialStateProperty.all(EdgeInsets.zero),
    shape: MaterialStateProperty.all(
      RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(8)),
      ),
    ),
  ),
  items: [
    PopupMenuItem(
      padding: EdgeInsets.zero,
      child: Container(
        color: Colors.blueGrey,
        child: Padding(
          padding: const EdgeInsets.all(12),
          child: Row(
            children: [
              Expanded(
                flex: 4,
                child: Text(
                  weekdayDate + ' Schedule',
                  style: TextStyle(color: Colors.white),
                ),
              ),
              Expanded(
                flex: 1,
                child: IconButton(
                  icon: Icon(Icons.add_outlined, color: Colors.white),
                  onPressed: () {},
                ),
              ),
            ],
          ),
        ),
      ),
    ),
    // 其他菜单项继续放在这里
  ],
);

方法二：临时 hack（不推荐） #

如果不想改整体菜单样式，可以给第一个PopupMenuItem里的Container加负顶部margin，强行抵消顶部边距（数值根据实际边距调整）：

Container(
  margin: EdgeInsets.only(top: -8), // 负margin抵消顶部空白
  color: Colors.blueGrey,
  // ... 其他代码不变
)

原理：showMenu的默认样式会给整个菜单容器加内边距，PopupMenuItem的padding: EdgeInsets.zero只能移除Item自身的内边距，管不到菜单容器的外padding，所以必须通过menuStyle修改容器样式才能彻底解决。

内容的提问来源于stack exchange，提问作者dddwv