Flutter弹出菜单悬停手型光标不生效问题求助

问题原因 #

你给PopupMenuItem设置的mouseCursor被内部嵌套的ListTile覆盖了——ListTile组件自身会处理鼠标交互逻辑，导致外层PopupMenuItem的光标设置无法生效。

解决方案 #

有两种可行的修复方式，按需选择：

方案一：给ListTile直接设置mouseCursor

直接把光标属性加在ListTile上，替换掉PopupMenuItem的设置：

PopupMenuItem<String>(
  padding: EdgeInsets.zero,
  child: ListTile(
    mouseCursor: SystemMouseCursors.click, // 直接给ListTile配置光标
    minLeadingWidth: 10,
    leading: SvgPicture.asset(Images.deleteGreyIcon),
    title: Text("Delete"),
  ),
  value: '1',
),
PopupMenuItem<String>(
  padding: EdgeInsets.zero,
  child: ListTile(
    mouseCursor: MouseCursor.uncontrolled,
    minLeadingWidth: 10,
    leading: SvgPicture.asset(Images.editIcon),
    title: Text("Rename"),
  ),
  value: '2',
),

方案二：替换ListTile，自定义菜单项布局

如果不需要ListTile的默认样式和交互，可以用Row等组件手动构建菜单项，这样PopupMenuItem的mouseCursor就能正常生效：

PopupMenuItem<String>(
  mouseCursor: SystemMouseCursors.click,
  padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
  child: Row(
    crossAxisAlignment: CrossAxisAlignment.center,
    children: [
      SvgPicture.asset(Images.deleteGreyIcon),
      SizedBox(width: 12),
      Text("Delete"),
    ],
  ),
  value: '1',
),
PopupMenuItem<String>(
  mouseCursor: MouseCursor.uncontrolled,
  padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
  child: Row(
    crossAxisAlignment: CrossAxisAlignment.center,
    children: [
      SvgPicture.asset(Images.editIcon),
      SizedBox(width: 12),
      Text("Rename"),
    ],
  ),
  value: '2',
),

说明 #

• 方案一适合想保留ListTile原有样式（比如内置的点击反馈、间距逻辑）的场景；
• 方案二更灵活，能完全自定义菜单项的布局和间距，避免ListTile的默认交互干扰。

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