如何实现Flutter页面不可关闭？自定义加载栏防返回关闭求助

核心问题是你的LoadingBar当前挂载在页面层级中，页面pop时会被一同销毁。要让它始终显示，需要将其挂载到不受页面生命周期影响的全局层级，以下是几种可行方案：

方案1：将LoadingBar挂载到MaterialApp全局层级 #

把自定义LoadingBar放在MaterialApp的builder中，使其属于整个App的根层级，同时用全局状态管理控制显示状态：

// 全局状态管理类（也可用Riverpod/Provider等状态库）
class LoadingManager {
  static bool _isLoading = false;
  static final _controller = ValueNotifier<bool>(false);

  static ValueNotifier<bool> get loadingNotifier => _controller;

  static void show() {
    _isLoading = true;
    _controller.value = true;
  }

  static void hide() {
    _isLoading = false;
    _controller.value = false;
  }
}

// 在main.dart中配置
void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const HomePage(),
      builder: (context, child) {
        return Stack(
          children: [
            child!,
            // 全局LoadingBar
            ValueListenableBuilder<bool>(
              valueListenable: LoadingManager.loadingNotifier,
              builder: (context, isLoading, _) {
                return isLoading ? const CustomLoadingBar() : const SizedBox.shrink();
              },
            ),
          ],
        );
      },
    );
  }
}

之后在任意页面调用LoadingManager.show()，即使页面返回，只要不调用hide()，LoadingBar就会持续显示。

方案2：插入全局OverlayEntry #

利用Flutter的Overlay层级（Navigator用来管理弹窗的层级），插入一个不会随页面pop销毁的OverlayEntry：

// 全局维护OverlayEntry实例
OverlayEntry? _loadingOverlay;

void showGlobalLoading(BuildContext context) {
  if (_loadingOverlay != null) return;
  _loadingOverlay = OverlayEntry(
    builder: (context) => const CustomLoadingBar(),
  );
  // 确保使用全局context（比如MaterialApp的context）
  Overlay.of(context, rootOverlay: true).insert(_loadingOverlay!);
}

void hideGlobalLoading() {
  _loadingOverlay?.remove();
  _loadingOverlay = null;
}

使用时直接调用showGlobalLoading，任务完成后调用hideGlobalLoading即可，无需担心页面返回影响。

方案3：拦截返回按钮（适用于禁止返回的场景） #

如果你的需求是loading期间不允许用户返回页面，可以用WillPopScope拦截返回事件：

@override
Widget build(BuildContext context) {
  return WillPopScope(
    onWillPop: () async {
      // 当loading显示时，阻止页面返回
      return !LoadingManager.loadingNotifier.value;
    },
    child: Scaffold(
      body: // 页面内容
    ),
  );
}

这个方案适合强制用户等待任务完成的场景，但如果需要允许返回同时保留loading，优先选前两个方案。

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