Flutter：如何在Dialog组件中阻止点击外部关闭对话框

你遇到的问题根源很明确：barrierDismissible 是 showDialog 方法的配置项，不是 Dialog 组件本身的属性，所以直接在 Dialog 组件里写这个参数完全不会生效。

正确的做法是：自定义 Dialog 组件只负责实现弹窗的UI样式，而控制“点击外部不关闭”的逻辑，要放在调用 showDialog 展示弹窗的时候。

以下是修改后的完整代码示例：

自定义Dialog组件（去掉无效参数） #

//RC
class ShowDialogGameOver2RC extends StatefulWidget {
  ShowDialogGameOver2RC({required this.score});

  final int score; // 建议用final修饰，避免late带来的潜在问题

  @override
  State<ShowDialogGameOver2RC> createState() => _ShowDialogGameOver2RC();
}

// 游戏结束弹窗状态类
class _ShowDialogGameOver2RC extends State<ShowDialogGameOver2RC> {
  @override
  Widget build(BuildContext context) {
    return Dialog(
      // 移除无效的barrierDismissible参数
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
      elevation: 2,
      backgroundColor: Colors.transparent,
      child: _buildChild(context),
    );
  }

  // 构建弹窗内部内容
  Widget _buildChild(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(20),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(15),
      ),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          const Text("游戏结束"),
          Text("你的得分: ${widget.score}"),
          const SizedBox(height: 16),
          ElevatedButton(
            onPressed: () => Navigator.of(context).pop(),
            child: const Text("确认"),
          ),
        ],
      ),
    );
  }
}

调用弹窗时设置禁止外部点击关闭 #

// 示例：在按钮点击事件中触发弹窗
ElevatedButton(
  onPressed: () {
    showDialog(
      context: context,
      barrierDismissible: false, // 这里设置才会生效
      builder: (context) => ShowDialogGameOver2RC(score: 88),
    );
  },
  child: const Text("触发游戏结束弹窗"),
)

这样设置后，用户点击弹窗外部区域不会关闭弹窗，必须通过弹窗内的确认按钮或者代码主动调用Navigator.pop才能关闭弹窗。

内容的提问来源于stack exchange，提问作者Carlos Peñaranda