Make flutter application fullscreen

How can I make a flutter application fullscreen. I already found out how to hide the status bar Hide Android Status Bar On Flutter App. but I can't seem to find how to hide the android navigation bar.


It's exactly like for Android status bar.

Doing SystemChrome.setEnabledSystemUIOverlays([]) hides both the status bar and the navigation bar.

p/s : use this SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values); to disable full screen mode.


// to hide only bottom bar:
SystemChrome.setEnabledSystemUIOverlays ([SystemUiOverlay.top]);

// to hide only status bar: 
SystemChrome.setEnabledSystemUIOverlays ([SystemUiOverlay.bottom]);

// to hide both:
SystemChrome.setEnabledSystemUIOverlays ([]);

Finally i found a way to set in one class for fullscreen. and disable on other classes.

To set full screen put this code in initState()

SystemChrome.setEnabledSystemUIOverlays([]);

and to set back to normal. In dispose()

SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values);

in the same class.

@override
  void dispose() {
        SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values);
    super.dispose();
  }
    
  @override
  initState() {
      SystemChrome.setEnabledSystemUIOverlays([]);
    super.initState();
  }

you can't set the

SystemChrome.restoreSystemUIOverlays();

in dispose(). because its already saying

**Restores the system overlays to the last settings provided via [setEnabledSystemUIOverlays].**
May be used when the platform force enables/disables UI elements.
          
For example, when the Android keyboard disables hidden status and navigation bars,
this can be called to re-disable the bars when the keyboard is closed.
          
On Android, the system UI cannot be changed until 1 second after the previous
change. This is to prevent malware from permanently hiding navigation buttons.`

Use setEnabledSystemUIMode (Recommended):

  • Fullscreen (with restoration):

    SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
    
  • Fullscreen (without restoration):

    SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersive);
    
  • Showing a particular overlay:

    SystemChrome.setEnabledSystemUIMode(
      SystemUiMode.manual,
      overlays: [
        SystemUiOverlay.top, // Shows Status bar and hides Navigation bar
      ],
    );
    
  • Exit fullscreen:

    SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
    

Restoration: Once the status and navigation bar are presented, they will be hidden again.