Flutter中跳转到新页面时如何去除上一页面的AppBar？

问题原因 #

你遇到的问题是跳转操作仅替换了部分页面区域，没有触发全页面路由覆盖，通常是嵌套导航器调用或者页面结构不规范导致的，可通过以下方案解决：

方案1：跳转时使用根导航器 #

如果项目中存在嵌套Navigator（比如全局底部导航、Shell路由架构的场景），默认从当前页面获取的导航器是子导航器，push操作只会替换子导航器对应的显示区域，不会覆盖外层的Screen1内容。只需在跳转时指定使用根导航器即可：
将VideoCard的onTap中原本的跳转代码：

Navigator.push(context, MaterialPageRoute(builder: (context) => Screen2()));

修改为：

Navigator.of(context, rootNavigator: true).push(
  MaterialPageRoute(builder: (context) => const Screen2()),
);

修改后新页面会完全覆盖当前屏幕，不会保留Screen1的自定义顶部栏。

方案2：确保Screen2为独立页面结构 #

如果Screen2没有包裹Scaffold组件，仅返回了内容区域的Widget，部分路由框架会复用上层的Scaffold结构，导致保留旧的顶部栏。你需要保证Screen2的build方法返回完整的Scaffold作为根容器：

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 可自定义Screen2的AppBar，不设置则不会显示
      // appBar: AppBar(title: const Text("Screen2")),
      body: const Center(child: Text("Screen2的内容")),
    );
  }
}

方案3：优化自定义AppBar的写法（可选） #

你当前把自定义的顶部栏（搜索框+返回按钮+标题组合）直接写在Scaffold的body属性中，不符合Flutter的页面结构规范，建议抽成自定义AppBar放到Scaffold的appBar属性中，能更好地适配路由逻辑：

class _AllVideosPageTabletState extends State<AllVideosPageTablet> {
  bool searchFlag = false;
  String searchText = '';

  // 抽出自定义AppBar
  PreferredSizeWidget get customAppBar {
    return PreferredSize(
      // 调整为你实际需要的高度
      preferredSize: const Size.fromHeight(120),
      child: Container(
        padding: const EdgeInsets.all(10.0),
        child: Column(
          children: [
            CupertinoSearchTextField(
              onChanged: (value) {
                if (value != '') {
                  setState(() {
                    searchFlag = true;
                    searchText = value;
                  });
                }
              },
              onSubmitted: (value) {
                if (value != '') {
                  setState(() {
                    searchFlag = true;
                    searchText = value;
                  });
                }
              },
            ),
            const Divider(),
            Row(
              children: [
                IconButton(
                  icon: Image.asset('lib/assets/icons/back.png'),
                  onPressed: () {
                    Navigator.pop(context);
                  },
                ),
                Expanded(
                  child: Center(
                    child: Text(
                      'All Videos',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        fontWeight: FontWeight.bold,
                        fontSize: 20,
                        color: '#D86300'.toColor(),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  @override
  void initState() {
    searchFlag = false;
    searchText = '';
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final isLandscape = MediaQuery.of(context).orientation == Orientation.landscape; 
    return Scaffold(
      // 将自定义AppBar赋值给appBar属性
      appBar: customAppBar,
      body: Container(
        padding: const EdgeInsets.all(10.0),
        child: Column(
          children: [
            searchFlag
                ? SearchResultsListView(searchText)
                : Expanded(
                    child: FutureBuilder(
                      future: VideoXML().getDataFromXML(context),
                      builder: (context, data) {
                        if (data.hasData) {
                          List<Video> videoList = data.data as List<Video>;
                          return GridView.count(
                            scrollDirection: Axis.vertical,
                            crossAxisCount: isLandscape ? 4 : 2,
                            crossAxisSpacing: 10.0,
                            mainAxisSpacing: 10.0,
                            children: videoList.map((video) {
                              return Padding(
                                padding: const EdgeInsets.all(10.0),
                                child: VideoCard(
                                  video.title,
                                  video.name,
                                  video.image,
                                ),
                              );
                            }).toList(),
                          );
                        } else {
                          return const Center(
                            child: CircularProgressIndicator(),
                          );
                        }
                      },
                    ),
                  ),
          ],
        ),
      ),
    );
  }
}

相关截图：

内容的提问来源于stack exchange，提问作者satheesh ck