Flutter IphoneX status bar color without app Bar

user_367949 0
Viewed 2274

I have a case where I do not want the app bar in my application , the problem is if I remove the app bar the status bar is coming in default color and there is no property in scaffolding to update status bar color , there is no effect of wrapping Body in safe are or not the status bar always stays

Sample Code

return Scaffold(
        body: ListView(
      children: <Widget>[
flutter-layout flutter
2 Answers

You can change the color of the status bar by making AppBar invisible. With PreferredSize we can set the Height of AppBar to 0 and set the backgroundColor property for status bar color.

appBar: PreferredSize(child: AppBar(
      backgroundColor: Colors.red,
      elevation: 0.0,
    ),
      preferredSize: Size.fromHeight(0.0)
  )
user_105486650

If you don't want to use a scaffold Scaffold, you can change this widget to change the text/icon color of the status bar:

AnnotatedRegion<SystemUiOverlayStyle>(
  value: SystemUiOverlayStyle.light, // or dark
  child: <your page>,
)

To change the background color, use a Container or DecoratedBox.

You can get the height of the status bar from MediaQuery.of(context).padding.

user_24619570
Related