如何控制CupertinoContextMenu的分隔线厚度？

CupertinoContextMenu官方组件并未直接提供调整分隔线厚度的属性，默认分隔线高度为1px。要实现自定义厚度，可通过自定义actions列表并插入自定义分隔线的方式解决，以下是具体实现：

方案：自定义带指定厚度分隔线的Actions列表 #

核心思路是遍历原有的ContextMenu动作列表，在每个动作之间插入自定义高度的分隔线容器，替代默认的分隔线。

1. 编写自定义Actions构建方法 #

在组件类中添加方法，生成带自定义分隔线的actions列表：

List<Widget> _buildCustomContextMenuActions(
  List<Widget> originalActions, 
  double dividerThickness,
  BuildContext context,
) {
  final List<Widget> customActions = [];
  // 复用系统主题的分隔线颜色，也可自定义为其他颜色
  final dividerColor = CupertinoTheme.of(context).dividerColor;

  for (int i = 0; i < originalActions.length; i++) {
    customActions.add(originalActions[i]);
    // 最后一个动作后不添加分隔线
    if (i != originalActions.length - 1) {
      customActions.add(Container(
        height: dividerThickness, // 设置你需要的分隔线厚度
        color: dividerColor,
        margin: const EdgeInsets.symmetric(horizontal: 16), // 对齐默认分隔线的左右边距
      ));
    }
  }
  return customActions;
}

2. 修改CupertinoContextMenu.builder的actions参数 #

将原有的contextMenuActions替换为上述方法生成的自定义列表：

return CupertinoContextMenu.builder(
  builder: (context, animation) {
    return SizedBox(
      width: MediaQuery.of(context).size.width /
          (mainAxisCount - animation.value),
      height: MediaQuery.of(context).size.width /
          (mainAxisCount - animation.value),
      child: cardBox(context,
          ratioFactor: animation.value < sizeLimit
              ? null
              : (size * animation.value),
          shatter: shatter,
          actions: actions,
          animated: animation.value != 0.0),
    );
  },
  // 传入自定义厚度（示例为0.5，可根据需求调整）
  actions: _buildCustomContextMenuActions(contextMenuActions, 0.5, context),
);

注意事项 #

• 如果原contextMenuActions中已包含默认分隔线，需先移除，避免重复显示。
• 可根据需求调整分隔线的color和margin参数，匹配你的UI风格。

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