Flutter界面pop黑屏问题

最新推荐文章于 2025-09-24 13:42:43 发布

原创最新推荐文章于 2025-09-24 13:42:43 发布 · 5.4k 阅读

1 ·

CC 4.0 BY-SA版权

flutter 专栏收录该内容

3 篇文章

订阅专栏

本文分析了在Flutter应用中使用Navigator.pop()导致黑屏的现象，并提供了一个具体的解决方案。问题出现的原因在于调用了错误的context进行pop操作，正确的做法是确保使用的context为当前页面构建时的context。

今天在写flutter的demo时调用pop结果黑屏了，原因在于我们使用Navigator.pop(context);时，此时的context并不是当前页面 Build时的context，而是上个界面的context，这样导致我们pop的时候，实际上并不是当前页面,而是关闭了上个界面，所以，出现了黑屏的问题。如下修改代码：

import 'package:flutter/material.dart';
class RouterActivity2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: "Router",
      theme: ThemeData(primaryColor: Colors.blue),
      home: RouterActivityB(context),
    );
  }
}

class RouterActivityB extends StatelessWidget {
  BuildContext pageContext;

  RouterActivityB(this.pageContext);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: FlatButton(
          onPressed: (){
            Navigator.of(pageContext).pop();
          },
          child: Icon(Icons.arrow_back, color: Colors.white,),
        ),
        title: Text("第二个页面"),
      ),
      body: Container(
        child: SizedBox.expand(
          child: Center(
            child: FlatButton(onPressed: () {
              Navigator.pop(context);
            }, child: Text("这是第二个界面", style: TextStyle(fontSize: 23, color: Colors.black87),)),
          )
        ),
      ),
    );
  }
}