显示用户友好的错误页面，而不是Flutter中的异常

Question

是否可以进行全局错误处理，以显示用户友好的错误页面，而不显示红色异常？

我已经进行了错误处理（here），该错误处理将向后端报告异常，但是我真正想要实现的是隐藏红色异常并显示一些更怪异的东西。

我到处搜索，却一无所获。很抱歉，我不显示任何代码，因为我不知道如何开始。

Answer 1

我在GitHub页面上打开了该问题，并得到了答案there。

Widget getErrorWidget(BuildContext context, FlutterErrorDetails error) {
  return Center(
    child: Text(
      "Error appeared.",
      style: Theme.of(context).textTheme.title.copyWith(color: Colors.white),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    ErrorWidget.builder = (FlutterErrorDetails errorDetails) {
      return getErrorWidget(context, errorDetails);
    };

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

Wouter Hardeman提供的解决方案

更新：

使用上述解决方案时，您将无法使用ThemeData，因为在定义自定义异常窗口小部件时没有实例化MaterialApp。要解决该问题，请执行以下操作：

 Widget getErrorWidget(BuildContext context, FlutterErrorDetails error) {
   return Center(
     child: Text(
       "Error appeared.",
       style: Theme.of(context).textTheme.title.copyWith(color: Colors.white),
     ),
   );
 }

 class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     ErrorWidget.builder = (FlutterErrorDetails errorDetails) {
       return getErrorWidget(context, errorDetails);
     };

     return MaterialApp(
       theme: ThemeData(
         primarySwatch: Colors.blue,
       ),
       builder: (BuildContext context, Widget widget) {
         ErrorWidget.builder = (FlutterErrorDetails errorDetails) {
           return getErrorWidget(context, errorDetails);
         };

         return widget;
       },
       title: 'Flutter Demo',
       home: MyHomePage(title: 'Flutter Demo Home Page'),
     );
   }
 }

---

没有自定义错误：

---

有自定义错误：

Answer 2

以Spectarion的答案为基础：

1. 添加了脚手架。如果没有Scaffold，该消息将显示在先前呈现的内容之上。
2. 将更多代码移至了辅助方法。

代码：

void setErrorBuilder() {
  ErrorWidget.builder = (FlutterErrorDetails errorDetails) {
    return Scaffold(
        body: Center(
            child: Text("Unexpected error. See console for details.")));
  };
} 

class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     setErrorBuilder();

     return MaterialApp(
       builder: (BuildContext context, Widget widget) {
         setErrorBuilder();    
         return widget;
       },
       title: 'Flutter Demo',
       home: MyHomePage(title: 'Flutter Demo Home Page'),
     );
   }
 }