How to Remove Debug Banner in Flutter ?

· 3 min read
How to Remove Debug in Flutter
How to Remove Debug in Flutter

When you create a new Flutter project for the first time you might have seen the Debug Banner on Right Top Corner of the application. Now a question arises that How to Remove Debug Banner in Flutter?

How to Remove Debug Banner in Flutter?

  • Add debugShowCheckModeBanner: false in MaterialApp() Widget and that should remove the banner on hot reload.
    MaterialApp(
      debugShowCheckedModeBanner: false
    )

    The Debug Banner will also automatically be removed on a release build.

  • If you are using Android Studio, you can find the option in the Flutter Inspector tab –> More Actions
Debug Banner In Flutter
Remove Debug Banner In Flutter
  • There is also another way for removing the “debug” banner from the flutter app. Now after the new release there is no “debugShowCheckedModeBanner: false,” code line in main. dart file. So I think these methods are effective:–> If you are using VS Code, then install “Dart DevTools” from extensions. After installation, you can easily find the “Dart DevTools” text icon at the bottom of the VS Code. When you click on that text icon, a link will be open in google chrome. From that link page, you can easily remove the banner by just tapping on the banner icon as shown.

    Remove Debug in Flutter
    Remove Debug in Flutter

Conclusion:

In this article, we have learned about Remove Debug Banner in Flutter?

Thanks for Reading!!!
Keep Learning.

Do let us know if you need any assistance with Flutter?

FlutterAgency.com is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget GuideFlutter ProjectsCode libs and etc.

FlutterAgency.com is one of the most popular online portal dedicated to Flutter Technology and daily thousands of unique visitors come to this portal to enhance their knowledge on Flutter.

Leave a Reply