Flutter问题：ElevatedButton onPress触发后Overlay未渲染显示

我仔细看了你的代码，核心问题出在异步操作的处理顺序上——你的Overlay刚启动就被立刻关闭了，所以完全看不到它的渲染效果。

问题分析 #

你的_submit是异步函数，但调用DatabaseService.createPayout时没有添加await关键字，再加上setState是同步执行的，代码会直接跳到OverlayLoadingProgress.stop(context)这一行。相当于Overlay刚被插入到页面中，下一秒就被移除了，自然没法显示出来。

修复方案 #

给DatabaseService.createPayout加上await，确保等待异步操作完成后再关闭Overlay，同时调整代码逻辑让状态更新更合理：

void _submit() async {
    HapticFeedback.mediumImpact();
    // 先启动加载Overlay
    OverlayLoadingProgress.start(context, barrierDismissible: false);
    if (!_isLoading) {
      setState(() {
        _isLoading = true;
      });

      // 等待异步创建支付的操作完成
      await DatabaseService.createPayout(context, widget.user!, widget.task!);

      setState(() {
        _isLoading = false;
      });
    }
    // 所有操作完成后再关闭Overlay
    OverlayLoadingProgress.stop(context);
  }

额外检查点 #

如果修复后还是看不到Overlay，可以再排查这两个地方：

• 确认Overlay.of(context)能获取到正确的OverlayState，可以在OverlayLoadingProgress.start里加个判断：

  final overlayState = Overlay.of(context);
  if (overlayState == null) {
    debugPrint("无法获取有效OverlayState");
    return;
  }
  overlayState.insert(_overlay!);
  

• 临时修改_LoadingWidget的barrierColor为Colors.red这类高对比度颜色，排查是否是颜色太接近背景导致看起来没显示。

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