flutter - 按下后退按钮时 Flutter 应用程序崩溃

Question

我的应用主页有一个搜索栏。当点击搜索栏时，用户将被重定向到搜索页面，如下所示：

class _HomeAppBarState extends State<HomeAppBar> {
  @override
  Widget build(BuildContext context) {
    return AppBar(
        backgroundColor: Colors.white,

        leading: IconButton(
            icon: Icon(Icons.account_circle, color: Colors.black) , onPressed: () => Scaffold.of(context).openDrawer()
        ),

        title: TextField(
          onTap: () {Navigator.push(context, MaterialPageRoute(builder: (context) => Search()));},
          decoration: InputDecoration(
            prefixIcon: Icon(Icons.search, color: Colors.black),
            hintText: "Search...",
          ),
        )
    );
  }
}

在搜索页面中。应用栏有一个后退按钮，然后按下后退按钮我希望用户回到主页。我尝试通过使用 Navigator.pop 来做如下：

class _SearchAppBarState extends State<SearchAppBar> {
  @override
  Widget build(BuildContext context) {
    return AppBar(
        backgroundColor: Colors.white,

        leading: IconButton(
            icon: Icon(Icons.arrow_back, color: Colors.black) , onPressed: () => Navigator.pop(context)
        ),

        title: TextField(
          autofocus: true,
          //onChanged: Do Stuff here.
          decoration: InputDecoration(
            prefixIcon: Icon(Icons.search, color: Colors.black),
            hintText: "Search App Bar...",
          ),
        )
    );
  }
}

但是当按下后退按钮时，我得到了非常奇怪的结果。

屏幕保持这样，当我再次单击返回按钮时，它会停留在搜索页面。

Answer 1

• 尝试automaticallyImplyLeading: true, 仅在搜索栏小部件上使用。而不是提供后退按钮并手动处理导航堆栈。

• 从根小部件中删除手动或自动后退按钮。

此外，用以下方式包装root小部件WillPopScope：

build(BuildContext context) {
  return WillPopScope(
    onWillPop: () async => false,
     child: //you root widget,
    ); 
}

WillPopScope小部件将忽略任何后按事件以弹出“根”小部件，因此不会出现您遇到的问题。

有关WillPopScope访问本文的更多详细信息： https ://codingwithjoe.com/flutter-navigation-how-to-prevent-navigation/

关于屏幕显示的问题，

如果 HomePage 是应用程序的父/根小部件，则在弹出 HomeWidget 时应该会导致黑屏。但似乎扭曲的屏幕视图是模拟器的错误。