How to remove Android back buttons on MaterialApp on Flutter?

Question

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);
  OrientationSingleton.left = true;
  SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft])
      .then((_) {
    runApp(new MyApp());
  });
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(

Here's my app. I've found some tutorials on how to remove it: flutter remove back button on appbar but it's for an AppBar. I tried making my app work on an AppBar but I get

MediaQuery.of() called with a context that does not contain a MediaQuery.

Because I rely on MediaQuery.of() inside my app.

So, how do I remove the Android back, home and square buttons on Flutter for a MaterialApp?

Stefano Amorelli Stefano Amorelli · Accepted Answer · 2020-12-14T00:14:14

As stated in the error message, SystemChrome requires context - a place to call it could be the initState() method of the Widget:

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

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

class _MyAppState extends State<MyApp> {
  @override
   void initState() {
     super.initState();
     SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);
     OrientationSingleton.left = true;
     SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft]);
   }

   @override
   Widget build(BuildContext context) {
      return MaterialApp(); // your MaterialApp class
   }
}

To hide the system bottom bar on Android, one option could be to call the setEnabledSystemUIOverlays() function with an empty list:

SystemChrome.setEnabledSystemUIOverlays([]);

However, this function is not globally supported on all Android devices.

How to remove Android back buttons on MaterialApp on Flutter?

1 Answers