In many cases you need to see the error exception of Flutter as friendly as possible when you develop your app. For example, this red stop screen error:
Fortunately, the red stop exception error screen of Flutter you can edit as you want with custom style.
In main function of dart you need to add customization of ErrorWidget.builder as the following:
`void main() {
ErrorWidget.builder = (FlutterErrorDetails details) => Material(
child: Container(
padding: const EdgeInsets.symmetric(vertical: 40.0, horizontal: 20.0),
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
// If you need to add another friendly photo
// you can here for example
const Text(
'Error',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.redAccent,
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 20),
Text(
details.exceptionAsString(),
textAlign: TextAlign.justify,
style: const TextStyle(
color: Colors.red,
fontSize: 18,
fontWeight: FontWeight.normal,
),
),
],
),
),
),
);
runApp(MyApp());
}`
And the result of any error as this instead of it before customization:
Finally, the error or Flutter exception appear more friendly when you develop your apps.
Top comments (0)