Black status bar on setting it to immersiveSticky

Question

I tried removing the status bar on my app and the solution I found included:

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);

but the Problem is when I set this either in the main() or in init() of my page, both ways I see a black status bar.

I have tried the following:

• setting the status bar to transparent
• setting the status bar to white
• instead of immersiveSticky, immersive and leanBack
• changing status bar brightness and status bar icon brightness

But I face the same problem which is that if there is a notification with a black icon, It is clearly visible on the invisible status bar

I found the problem but I dont know how to fix it. On vivo, apps can decide to show the camera or hide it with a black strip(in my case), but I had to manually change the setting from Automatic Fitting (let app decide) to Show the camera I want the app to do this automatically

Example:

class Example extends StatefulWidget {
 const Example({super.key});
 @override
 State<Example> createState() => _ExampleState();
}
class _ExampleState extends State<Example> {
@override
 void initState() {
 SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
 super.initState();
 }
@override
 Widget build(BuildContext context) {
return Container();
}
}

Answer 1

Add in 'android/app/src/main/res/values/styles.xml'

<item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>

It's worked for me.