How to hide android's bottom navigation bar in flutter

I'm really new in flutter and also in Android dev, but is it possible to hide the bottom navigation bar (see which item do i mean below) programmatically?

enter image description here


Solution 1:

Try this: SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]);

Document

Solution 2:

Use SystemChrome.setEnabledSystemUIOverlays([]) to hide the status bar and the navigation bar.

Solution 3:

For specifies the set of system overlays to have visible when the application is running. you can use below static method:

  SystemChrome.setEnabledSystemUIOverlays(List<SystemUiOverlay> overlays)

Examples :

1 - For Hide bottom navigation bar and Still Status bar visible

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]);

2 - For Still bottom navigation visible bar and Hide Status bar

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);

3 - For hide both bottom Navigation and Status bar

SystemChrome.setEnabledSystemUIOverlays([]);

4 - For make both visible

 SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top, SystemUiOverlay.bottom]);

Solution 4:

Currently this feature is bugged in flutter, you can see this issue here.

https://github.com/flutter/flutter/issues/62412

Normally you would need to do the following:

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]); 

Solution 5:

At the time of writing this answer all of the other posts here are outdated, using setEnabledSystemUIOverlays will give a deprecation message.

To hide the system navigation bar or status bar import:

import 'package:flutter/services.dart';

And use the service SystemChrome.setEnabledSystemUIMode

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);

The function setEnabledSystemUIMode receives the SystemUiMode Enum which has the following options:

  • leanBack - Fullscreen display with status and navigation bars presentable by tapping anywhere on the display.

  • immersive - Fullscreen display with status and navigation bars presentable through a swipe gesture at the edges of the display.

  • immersiveSticky - Fullscreen display with status and navigation bars presentable temporarly through a swipe gesture at the edges of the display.

  • edgeToEdge - Fullscreen display with status and navigation elements rendered over the application.

  • manual - Declares manually configured [SystemUiOverlay]s. (look at the docs for more information)