Flutter侧滑返回关闭应用，保留NavigationBar的问题求解

问题根源 #

你遇到的核心问题是导航层级不匹配：

• 直接使用Navigator.of(context)时，新页面被推入当前上下文对应的子导航栈（比如NavigationBar某个Tab的独立导航栈），当该子栈仅包含当前页面时，侧滑返回会触发整个子栈退出，导致应用关闭。
• 添加rootNavigator: true后，页面被推入根导航栈，此时根栈页面会覆盖NavigationBar所在的页面层级，因此导航栏消失。

解决方案 #

方案1：使用Tab专属导航Key控制页面跳转

如果你的NavigationBar每个Tab对应独立的Navigator，提前为每个Tab的导航器定义全局Key，通过Key直接将页面推入对应Tab的子导航栈，既能保证侧滑返回正常，又能保留NavigationBar。

示例代码：

// 提前定义Tab的导航Key
final GlobalKey<NavigatorState> _tabNavKey = GlobalKey<NavigatorState>();

// 在NavigationBar的body中，对应Tab的页面使用该Key
Navigator(
  key: _tabNavKey,
  initialRoute: '/',
  onGenerateRoute: (settings) {
    return MaterialPageRoute(builder: (context) => YourTabHomePage());
  },
)

// 按钮跳转逻辑
@override
Widget build(BuildContext context) {
  return ElevatedButton.icon(
    onPressed: () {
      _tabNavKey.currentState?.push(
        MaterialPageRoute(
          builder: (context) => Scaffold(
            appBar: AppBar(title: const Text("Back Swipe")),
            body: const Center(child: SizedBox()),
          ),
        ),
      );
    },
    icon: const Icon(Icons.sunny),
    label: const Text("Hello"),
  );
}

方案2：确保获取正确的子导航上下文

如果没有使用全局Key，需确保跳转时获取的是当前Tab对应的子导航上下文，而非根导航或其他层级的上下文。可以通过明确指定rootNavigator: false（默认值，可省略），或向上查找正确的导航器：

Navigator.of(context, rootNavigator: false).push(
  MaterialPageRoute(
    builder: (context) => Scaffold(
      appBar: AppBar(title: const Text("Back Swipe")),
      body: const Center(child: SizedBox()),
    ),
  ),
);

注意：此方法要求按钮所在Widget的上下文属于当前Tab的子导航栈层级，若上下文被其他导航器包裹，需调整Widget嵌套结构。

方案3：自定义路由的侧滑行为

如果以上方法无效，可以通过自定义路由的过渡行为，强制保留侧滑返回逻辑，同时避免影响根导航栈：

Navigator.of(context).push(
  CupertinoPageRoute(
    builder: (context) => Scaffold(
      appBar: AppBar(title: const Text("Back Swipe")),
      body: const Center(child: SizedBox()),
    ),
    // 强制启用侧滑返回
    maintainState: true,
  ),
);

CupertinoPageRoute默认支持侧滑返回，且会在当前导航栈内处理页面弹出，不会触发应用关闭。

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