Flutter Remove Debug Banner Image in Android iOS Emulator Screenshot

Debug banner image shows at the top right side of flutter android and iOS application. The main purpose of debug banner is to notify the application developer that your application is currently running in debug mode. By default debug banner image is enabled in every flutter project. If we take the screenshot of application for display purpose then the debug banner looks bad on screen. But using the debugShowCheckedModeBanner: false method we can easily hide the debug mode banner. So in this tutorial we would Remove Debug Banner Image in Android iOS Emulator in Flutter while taking Screenshot.

Contents in this project Remove Debug Banner Image in Android iOS Emulator:

1. Import material.dart package in your app’s main.dart file.

import 'package:flutter/material.dart';

1	import 'package:flutter/material.dart';

2. Call our main MyApp class using runApp().

void main() => runApp(MyApp());

1	void main() => runApp(MyApp());

3. Create our main class named as MyApp extends with StatelessWidget.

class MyApp extends StatelessWidget {


}

class MyApp extends StatelessWidget {

}

4. Create Widget Build area in MyApp class. Now we would return the Material App and inside the Material App we would define debugShowCheckedModeBanner: false to hide the debug banner.

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
        home: Scaffold(
            backgroundColor: Colors.green,
            body: SafeArea(
              child: Center(
                      
                        )
                    )
                )
            );
  }
}

class MyApp extends StatelessWidget {

@override

Widget build(BuildContext context) {

return MaterialApp(

debugShowCheckedModeBanner: false,

home: Scaffold(

backgroundColor: Colors.green,

body: SafeArea(

child: Center(

)

);

}

5. Create Text widget in Center widget with some text.

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
        home: Scaffold(
            backgroundColor: Colors.green,
            body: SafeArea(
              child: Center(
                      child: (  Text('Remove Debug Banner Image from Android iOS Emulator', 
                      textAlign: TextAlign.center,
                      style: TextStyle(color: Colors.white, fontSize: 26), )  )
                        )
                    )
                )
            );
  }
}

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {

@override

Widget build(BuildContext context) {

return MaterialApp(

debugShowCheckedModeBanner: false,

home: Scaffold(

backgroundColor: Colors.green,

body: SafeArea(

child: Center(

child: ( Text('Remove Debug Banner Image from Android iOS Emulator',

textAlign: TextAlign.center,

style: TextStyle(color: Colors.white, fontSize: 26), ) )

)

);

}

6. Complete source code for main.dart file:

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
        home: Scaffold(
            backgroundColor: Colors.green,
            body: SafeArea(
              child: Center(
                      child: (  Text('Remove Debug Banner Image from Android iOS Emulator', 
                      textAlign: TextAlign.center,
                      style: TextStyle(color: Colors.white, fontSize: 26), )  )
                        )
                    )
                )
            );
  }
}