Flutter Change color Notches

user_9638377 0
Viewed 173

I have a question.

Is it possible to change the color of the phone notch? how is it framed in red

And detect the oval edge of the screen? All this in Flutter

enter image description here

flutter user-interface
2 Answers

I am guessing you wish to change the color of the status bar? If so you can add this code snippet in your initState function.

  void initState() 
  {
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.white,
      statusBarBrightness: Brightness.light,
      statusBarIconBrightness: Brightness.dark, 
    ));
    super.initState();
  }

The statusBarColor will be the actual color of the background of your status bar. The other two attributes change how the icons of the status bar look.

user_126038630

To detect the oval edge and make sure content isn’t on it where you can’t see it, wrap your Scaffold in a SafeArea.

user_66586460
Related