Android Keyboard causes Status Bar to reappear

Question

I need to hide the Android Status bar in my app so i am using the following code

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

main() {
  SystemChrome.setEnabledSystemUIOverlays([]);
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Center(child: TextField()), backgroundColor: Colors.orange));
  }
}

I have a textfield in the screen so whenever the Android Keyboard opens the status bar reappears. I have tried with multiple Android devices and i am getting the same bug.

Is this really a bug in the framework or am i doing something wrong?

I have attached a short video link below to show the bug

https://drive.google.com/file/d/19qs5Rsrfc_G1oN5kbxgKvYQAXpTr8RZx/view?usp=sharing

I have not tested in iOS

score 2 · Accepted Answer · edited Jan 31 '19 at 06:27

2

Please share some code. I tried adding SystemChrome.setEnabledSystemUIOverlays([]); in initState() and I have a text field, It is working fine.

edited Jan 31 '19 at 06:27

Günter Zöchbauer

623,577
216
2,003
1,567

answered Jan 31 '19 at 06:26

Keerti Purswani

4,878
3
16
29

I have added code in the question, please have a look – Jan 31 '19 at 06:26
Check on a real device – Jan 31 '19 at 06:27
Checked your code on real device. Working fine for me. Sharing video to show – Keerti Purswani Jan 31 '19 at 06:38
https://drive.google.com/file/d/1ZfBMNXYEnXZL_zALiMEVBZSrPDHxlHVM/view?usp=drivesdk – Keerti Purswani Jan 31 '19 at 06:45
which device are you using and android version. I am using Redmi with Android Marshmallow – Jan 31 '19 at 06:46
I am using MiA1 - Android Version 9. You said you tried on multiple devices right? Which ones? – Keerti Purswani Jan 31 '19 at 06:50
I also tried on Redmi - Lollipop, Coolpad - Marshmallow – Jan 31 '19 at 06:56
I guess then the issue is because of Android's Fragmentation – Jan 31 '19 at 07:03

score 2 · Answer 2 · answered Jul 15 '21 at 12:04

What I did is after the Keyboard was shown, delay for 2 (the doc says one) seconds and then call setEnabledSystemUIOverlays again.

Future.delayed(Duration(seconds: 2)).then((value) => SystemChrome.setEnabledSystemUIOverlays([]));

According to: https://api.flutter.dev/flutter/services/SystemChrome/setEnabledSystemUIOverlays.html

when the keyboard becomes visible, it will enable the navigation bar and status bar system UI overlays. When the keyboard is closed, Android will not restore the previous UI visibility settings, and the UI visibility cannot be changed until 1 second after the keyboard is closed to prevent malware locking users from navigation buttons.

To regain "fullscreen" after text entry, the UI overlays should be set again after a delay of 1 second. This can be achieved through restoreSystemUIOverlays or calling this again. Otherwise, the original UI overlay settings will be automatically restored only when the application loses and regains focus.

hararot so · Answer 3 · 2023-05-30T22:46:22.363

From your code here :

SystemChrome.setEnabledSystemUIOverlays([]);

you should change setEnabledSystemUIOverlays which is now deprecated to :

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky)
      .then((value) {
    runApp(MyApp());
  });
}

What I understand from you're question is that you think this is a bug in Flutter but to my understanding of Flutter documents this is a normal behavior that is intended whenever keyboard is shown, Apparently

This is to prevent malware from permanently hiding navigation buttons
source

I do not know how to override that but to solve you're problem you should use SystemChrome.restoreSystemUIOverlays(); after you are done with the keyboard input.

This should be the end of my answer.

But to those who do not know how to do it you need to check the condition if the keyboard is open or not, you could use WidgetsBinding.instance.window.viewInsets.bottom , answered by Deepak Raj

OR you could use: KeyboardVisibilityBuilder

By Andrey Gordeev his answer

KeyboardVisibilityBuilder(
    builder: (context, child, isKeyboardVisible) {
      if (isKeyboardVisible) {
        // when keyboard is visible

      } else {
        // when keyboard is invisible
        SystemChrome.restoreSystemUIOverlays();
      }
      return child;
    },
    child: TextField(),
  )

Here is the result:

Android Keyboard causes Status Bar to reappear

3 Answers3

OR you could use: KeyboardVisibilityBuilder

Linked