DEV Community

Cover image for Hello Flutter Developers👋
Areeba Farooq
Areeba Farooq

Posted on

2 2

Hello Flutter Developers👋

🛡️ Did you know you can customize the Flutter red-screen of death?😈

We understand that facing the red screen of death can be terrifying and eye-boggling, so here’s a

Tip😃:

To customize the red screen of death, you can call the ‘ErrorWidget.builder( )’ widget in you void main( ) { } method and customize your red screen.

import 'package:flutter/material.dart';

import 'home.dart';

void main() {
  ErrorWidget.builder = (FlutterErrorDetails details) => Material(
        child: Container(
            padding: const EdgeInsets.symmetric(vertical: 30, horizontal: 20),
            child: Center(
                child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    mainAxisSize: MainAxisSize.min,
                    children: [
                  Image.asset("assets/error.png"),
                  const SizedBox(height: 20),
                  const Text(
                    'Error',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                        color: Colors.red,
                        fontSize: 20,
                        fontWeight: FontWeight.bold),
                  ),
                  const SizedBox(height: 20),
                  Text(details.exceptionAsString(),
                      textAlign: TextAlign.center,
                      style: const TextStyle(
                          color: Colors.red,
                          fontSize: 18,
                          fontWeight: FontWeight.normal))
                ]))),
      );
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'E-Learning App',
      theme: ThemeData(
        scaffoldBackgroundColor: Colors.grey[900],
        primarySwatch: Colors.blue,
        fontFamily: 'Urbanist',
      ),
      home: const HomeScreen(),
    );
  }
}

Enter fullscreen mode Exit fullscreen mode

Give it a try and let me know how it went!

Support Me:

Instagram
Facebook
Github
Medium

Sentry blog image

The Visual Studio App Center’s retiring

But sadly….you’re not. See how to make the switch to Sentry for all your crash reporting needs.

Read more

Top comments (0)

Jetbrains image

Build Secure, Ship Fast

Discover best practices to secure CI/CD without slowing down your pipeline.

Read more