SafeArea doesn't work with SystemChrome.setEnabledSystemUIOverlays([]);

[Kassan424kh]

cann't enable the top area on my app, like before the last master flutter upgrade.

flutter doctor -v
[√] Flutter (Channel master, 1.18.0-9.0.pre.122, on Microsoft Windows [Version 10.0.18363.778], locale en-DE)
    • Flutter version 1.18.0-9.0.pre.122 at C:\src\flutter
    • Framework revision 9a99403ad2 (9 hours ago), 2020-05-04 22:29:02 -0400
    • Engine revision 95ecd9a405
    • Dart version 2.9.0 (build 2.9.0-5.0.dev e7bebea059)

[√] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
    • Android SDK at C:\Users\GaminKh\AppData\Local\Android\sdk
    • Platform android-29, build-tools 29.0.3
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_212-release-1586-b04)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.4.6)
    • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community
    • Visual Studio Community 2019 version 16.4.29905.134

[√] Android Studio (version 3.6)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin version 45.1.1
    • Dart plugin version 192.7761
    • Java version OpenJDK Runtime Environment (build 1.8.0_212-release-1586-b04)

[√] IntelliJ IDEA Ultimate Edition (version 2019.3)
    • IntelliJ at C:\Program Files\JetBrains\IntelliJ IDEA 2019.3.3
    • Flutter plugin version 45.0.2
    • Dart plugin version 193.6911.31

[√] VS Code (version 1.44.2)
    • VS Code at C:\Users\GaminKh\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.9.1

[√] Connected device (5 available)
    • SM N960F                  • 192.168.0.101:5555 • android-arm64  • Android 10 (API 29)
    • Android SDK built for x86 • emulator-5554      • android-x86    • Android 10 (API 29) (emulator)
    • Windows                   • Windows            • windows-x64    • Microsoft Windows [Version 10.0.18363.778]
    • Web Server                • web-server         • web-javascript • Flutter Tools
    • Chrome                    • chrome             • web-javascript • Google Chrome 81.0.4044.129

return Scaffold(
      resizeToAvoidBottomInset: false,
      resizeToAvoidBottomPadding: false,
      body: Stack(
        children: <Widget>[
          SafeArea(
            bottom: false,
            top: true,
            child: Stack(
              children: [
                NavigationBar(),
                AppBody(),
              ],
            ),
          ),
        ],
      ),
    )

link to image how it looks like now

[VladyslavBondarenko]

Hi @Kassan424kh With using master 1.18.0-9.0.pre.122 I can see intended result with Android 9-10, iOS 13.4.

code

``` import 'package:flutter/material.dart'; void main() => runApp(MaterialApp(home: MyApp())); class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State { @override Widget build(BuildContext context) { return Scaffold( resizeToAvoidBottomInset: false, resizeToAvoidBottomPadding: false, body: Stack( children: [ SafeArea( bottom: false, top: true, child: Stack( children: [ Container( width: 100, height: 100, color: Colors.grey, ), ], ), ), ], ), ); } } ```

Could you provide a complete minimal code sample to reproduce?

[Kassan424kh]

hello @VladyslavBondarenko ,

my complete code is:

code sample

```dart import 'dart:async'; import 'dart:io'; import 'package:athan/app_body/app_body.dart'; import 'package:athan/components/animated_background_image.dart'; import 'package:athan/configs/app_translation.dart'; import 'package:athan/navigation_bar/navigation_bar.dart'; import 'package:athan/provider/ablution_provider.dart'; import 'package:athan/provider/app_body_provider.dart'; import 'package:athan/provider/navigate_provider.dart'; import 'package:athan/provider/styling_provider.dart'; import 'package:athan/styling/app_styling.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:permission_handler/permission_handler.dart'; import 'package:provider/provider.dart'; void main() async { return runApp(Main()); } ///+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ class Main extends StatefulWidget { @override _MainState createState() => _MainState(); } class _MainState extends State

{ Future _enablePermissions () async{ // You can request multiple permissions at once. await [ Permission.location, ].request(); if (await Permission.speech.isPermanentlyDenied) { openAppSettings(); } } @override void initState() { super.initState(); _enablePermissions(); SystemChrome.setEnabledSystemUIOverlays([]); } @override Widget build(BuildContext context) { SystemChrome.setPreferredOrientations([ DeviceOrientation.portraitUp, DeviceOrientation.portraitDown, ]); return MultiProvider( providers: [ ChangeNotifierProvider( create: (_) => StylingProvider(), ), ChangeNotifierProvider( create: (_) => NavigateProvider(), ), ChangeNotifierProvider( create: (_) => AblutionProvider(), ), ChangeNotifierProvider( create: (_) => AppBodyProvider(), ), ], child: Consumer( builder: (_, settings, child) { return MaterialApp(home: MyApp()); }, ), ); } } ///+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State { @override void initState() { super.initState(); } @override void didChangeDependencies() { Timer(Duration(milliseconds: 10), () { final size = MediaQuery.of(context).size; final _appTranslation = AppTranslation.selectedLanguage; final double positionUnshownPages = _appTranslation[TranslationFontStyling.textDirection] == TextDirection.rtl ? -size.width : size.width; Provider.of(context, listen: false).setPages({ "prayer-times": 0, "ablution": positionUnshownPages, "qibla-location": positionUnshownPages, "settings": positionUnshownPages, }, context); }); super.didChangeDependencies(); } @override Widget build(BuildContext context) { final _appTheme = Provider.of(context).selectedTheme; final size = MediaQuery.of(context).size; return Scaffold( resizeToAvoidBottomInset: false, resizeToAvoidBottomPadding: false, body: Stack( children: [ AnimatedBackgroundImage( navigateUrl: "prayer-times", image: _appTheme[AppPagesBackgroundImages.prayerTimes], ), AnimatedBackgroundImage( navigateUrl: "ablution", image: _appTheme[AppPagesBackgroundImages.ablution], ), AnimatedBackgroundImage( navigateUrl: "qibla-location", image: _appTheme[AppPagesBackgroundImages.qiblaLocation], blurEffectDark: true, ), AnimatedBackgroundImage( navigateUrl: "settings", image: _appTheme[AppPagesBackgroundImages.settings], blurEffectDark: true, ), SafeArea( bottom: false, top: Platform.isIOS && size.height < AppStyling.iphoneSEDisplayHeight ? false : true, child: Stack( children: [ NavigationBar(), AppBody(), ], ), ), ], ), ); } } ```

[Kassan424kh]

ok I switched to one version previou 1.18.0-8.0.pre it works without any problem

[VladyslavBondarenko]

@Kassan424kh could you provide a minimal and complete reproducible code sample, such that I can copy and run?

[Kassan424kh]

Hy @VladyslavBondarenko,

surry about the long code, I added to your code only this:

...
  @override
  void initState() {
    SystemChrome.setEnabledSystemUIOverlays([]);
  }

  @override
  Widget build(BuildContext context) {
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown,
    ]);
    return Scaffold(
...

after added it, the problem displayed again on all master versions after 1.18.0-8.0.pre version.

code sample

```dart import 'package:flutter/material.dart'; void main() => runApp(MaterialApp(home: MyApp())); class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State { @override void initState() { SystemChrome.setEnabledSystemUIOverlays([]); } @override Widget build(BuildContext context) { SystemChrome.setPreferredOrientations([ DeviceOrientation.portraitUp, DeviceOrientation.portraitDown, ]); return Scaffold( resizeToAvoidBottomInset: false, resizeToAvoidBottomPadding: false, body: Stack( children: [ SafeArea( bottom: false, top: true, child: Stack( children: [ Container( width: 100, height: 100, color: Colors.grey, ), ], ), ), ], ), ); } } ```

[iapicca]

Hi @Kassan424kh I see you are calling setPreferredOrientations inside the build function before return just tested this code in master and works as intended does this solution solve the problem for you? Thank you

[Kassan424kh]

Hy again,

sorry because I didn't have internet I cannot answer in the last few days, @iapicca thanks for your code, but the problem is still dosent works, i think my bug would shown because i useSystemChrome.setEnabledSystemUIOverlays([]); in my code, but i don't know how can this be fexid 😥.

[Kassan424kh]

It's a way to get the height of the statusbar?

[iapicca]

Hi @Kassan424kh As mentioned before the issue depends from your implementation rather than Flutter itself This platform is not meant for assistance on personal code. Please see https://flutter.dev/community for resources and asking questions like this, you may also get some help if you post it on Stack Overflow. Closing, as this isn't an issue with Flutter itself, if you disagree please write in the comments and I will reopen it Thank you

[Kassan424kh]

Hi @iapicca,

but this is not only on code I writed, after add "SystemChrome.setEnabledSystemUIOverlays([]);" to any flutter project, cann't MediaQuery.of(context).padding.top works more, this is the problem I have.

[iapicca]

Hi @Kassan424kh did you try the code sample provided? You may want to avoid running function that cause the widget to rebuild inside initState() and in build()(before return); your sample code doesn't have any reference to Mediaquery.of(...).

This platform is meant to contribute to flutter reporting bugs and providing new features, your request seems oriented to solve the problem in your code, for that please address the community Thank you

[Kassan424kh]

Hi @iapicca

doesn't have any reference to Mediaquery.of(...). SafeArea use MediaQuery.of(context).padding.top to get the height of the Notch/Statusbar.

[iapicca]

Hi @Kassan424kh does the the code sample provided work for you? Thank you

[Kassan424kh]

Hi @iapicca no thank you

[VladyslavBondarenko]

@Kassan424kh

With such code

``` import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; void main() => runApp(MaterialApp(home: MyApp())); class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State { @override void initState() { // SystemChrome.setEnabledSystemUIOverlays([]); } @override Widget build(BuildContext context) { SystemChrome.setPreferredOrientations([ DeviceOrientation.portraitUp, DeviceOrientation.portraitDown, ]); return Scaffold( resizeToAvoidBottomInset: false, resizeToAvoidBottomPadding: false, body: Stack( children: [ SafeArea( bottom: false, top: true, child: Stack( children: [ Text('MediaQuery.of(context).padding.top: ${MediaQuery.of(context).padding.top}'), ], ), ), ], ), ); } } ```

I see this result without using SystemChrome.setEnabledSystemUIOverlays([]);

And this result with using SystemChrome.setEnabledSystemUIOverlays([]);

On Pixel 3 XL Android 10 (API 29) (emulator), the same for current dev 1.19.0-1.0.pre and stable 1.17.1.

Trying to reproduce your issue I'm experiencing another issue https://github.com/flutter/flutter/issues/46486.

Are you experiencing having content out of safe area with different devices? what emulator do you use?

[Kassan424kh]

Hi @VladyslavBondarenko ,

46486 I think this is same like my Problem,

Are you experiencing having content out of safe area with different devices? no and yes in some projectes yes another not what emulator do you use? Galaxy note 10 +

Thank you

[VladyslavBondarenko]

@Kassan424kh

With this code @TahaTesser confirmed with Galaxy M30 (Android 10) he faced the same result as you .

Without SystemChrome.setEnabledSystemUIOverlays([]); on current dev 1.19.0-1.0.pre

With SystemChrome.setEnabledSystemUIOverlays([]); on current dev 1.19.0-1.0.pre.

(With my Redmi Note 7 (Android 9) with nothch on the screen I can see the same result as on the last image, unlike Galaxy M30)

WithSystemChrome.setEnabledSystemUIOverlays([]); on current stable 1.17.1

[Kassan424kh]

Hi @VladyslavBondarenko,

is here any update?

thanks

[goderbauer]

/cc @xster Do you know if anything recently changed in how the engine reports window.padding for notched android devices?

[xster]

@GaryQian could you take a look at this issue?

[sanekyy]

same issue

[TahaTesser]

Hi @sanekyy @Kassan424kh

Tried on Galaxy M30, the safe area seems to work on the latest sable and the master channels

Please try code sample on the latest stable channel

code sample

```dart import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Material App', home: Home(), ); } } class Home extends StatelessWidget { @override Widget build(BuildContext context) { SystemChrome.setEnabledSystemUIOverlays([]); return Scaffold( body: Center( child: Scaffold( body: Center( child: Container( child: Text( 'MediaQuery.of(context).padding.top: ${MediaQuery.of(context).padding.top}'), ), ), ), ), ); } } ```

flutter doctor -v

```bash [✓] Flutter (Channel stable, 1.22.6, on Microsoft Windows [Version 10.0.19042.746], locale ko-KR) • Flutter version 1.22.6 at C:\Users\Taha\Code\flutter_stable • Framework revision 9b2d32b605 (6 days ago), 2021-01-22 14:36:39 -0800 • Engine revision 2f0af37152 • Dart version 2.10.5 [✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3) • Android SDK at C:\Users\Taha\Code\SDK • Platform android-30, build-tools 30.0.3 • ANDROID_HOME = C:\Users\Taha\Code\SDK • Java binary at: C:\Users\Taha\Code\android-studio\jre\bin\java • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01) • All Android licenses accepted. [!] Android Studio (version 4.1.0) • Android Studio at C:\Users\Taha\Code\android-studio ✗ Flutter plugin not installed; this adds Flutter specific functionality. ✗ Dart plugin not installed; this adds Dart specific functionality. • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01) [✓] VS Code (version 1.52.1) • VS Code at C:\Users\Taha\AppData\Local\Programs\Microsoft VS Code • Flutter extension version 3.18.1 [✓] Connected device (2 available) • SM M305F (mobile) • 32003c30dc19668f • android-arm64 • Android 10 (API 29) • Android SDK built for x86 (mobile) • emulator-5554 • android-x86 • Android 10 (API 29) (emulator) ! Doctor found issues in 1 category. ``` ```bash [✓] Flutter (Channel master, 1.26.0-13.0.pre.231, on Microsoft Windows [Version 10.0.19042.746], locale ko-KR) • Flutter version 1.26.0-13.0.pre.231 at C:\Users\Taha\Code\flutter_master • Framework revision 29e604e241 (7 hours ago), 2021-01-28 00:04:03 -0800 • Engine revision 68cd4c42b5 • Dart version 2.12.0 (build 2.12.0-267.0.dev) [✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3) • Android SDK at C:\Users\Taha\Code\SDK • Platform android-30, build-tools 30.0.3 • ANDROID_HOME = C:\Users\Taha\Code\SDK • Java binary at: C:\Users\Taha\Code\android-studio\jre\bin\java • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01) • All Android licenses accepted. [✓] Chrome - develop for the web • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe [✓] Visual Studio - develop for Windows (Visual Studio Community 2019 16.8.3) • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community • Visual Studio Community 2019 version 16.8.30804.86 • Windows 10 SDK version 10.0.18362.0 [✓] Android Studio (version 4.1.0) • Android Studio at C:\Users\Taha\Code\android-studio • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01) [✓] VS Code (version 1.52.1) • VS Code at C:\Users\Taha\AppData\Local\Programs\Microsoft VS Code • Flutter extension version 3.18.1 [✓] Connected device (5 available) • SM M305F (mobile) • 32003c30dc19668f • android-arm64 • Android 10 (API 29) • Android SDK built for x86 (mobile) • emulator-5554 • android-x86 • Android 10 (API 29) (emulator) • Windows (desktop) • windows • windows-x64 • Microsoft Windows [Version 10.0.19042.746] • Chrome (web) • chrome • web-javascript • Google Chrome 87.0.4280.141 • Edge (web) • edge • web-javascript • Microsoft Edge 88.0.705.50 • No issues found! ```

[pedromassangocode]

Without additional information, we are unfortunately not sure how to resolve this issue. We are therefore reluctantly going to close this bug for now. Please don't hesitate to comment on the bug if you have any more information for us; we will reopen it right away!
Thanks for your contribution.

Could everyone who still has this problem please file a new issue with the exact description of what happens, logs, and the output of flutter doctor -v. All system setups can be slightly different, so it's always better to open new issues and reference related issues.

[github-actions[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.