How To Remove Debug Banner In Flutter On Android App

admin_img Posted By Bajarangi soft , Posted On 21-09-2020

Debug banner image shows at the top right side of flutter android and iOS application. By default debug banner image is enabled in every flutter project.

Remove Debug Banner in Flutter

To remove this you can use debugShowCheckedModeBanner property of MaterialApp() widget. If you set this property to false , banner will be disappeared.

MaterialApp(
  debugShowCheckedModeBanner: false,
  title: 'App Design',
  home: MyHomePage(),
);

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

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'App Design',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text('App Design',style: TextStyle(
          fontSize: 18.0,
          fontWeight: FontWeight.bold,
        ),
        ),
        backgroundColor: Colors.black,
      ),
    );
  }
}

Related Post