CODEWITHSUNDEEP
flutterflutter-layout
Michel Feinstein
Michel Feinstein

Reputation: 14304

How to change the Status Bar color in Flutter when we are using an AppBar?

I know we can change the Status Bar using:

But the docs mention the AppBar will set the Status Bar color automatically, so the question I have is, how do I set the Status Bar color, when I have an AppBar in place, but I want to define a specific color myself and not let the AppBar do it automatically?

Upvotes: 0

Views: 519

Answers (2)

Shahril aidi
Shahril aidi

Reputation: 29

Additional Note: Status bar Icon Color

if the status bar icon not changing to dark or light mode. Make sure to add brightness in appbar.

appbar :Appbar (
 brightness: Brightness.light,),

Can be change to .dark or .light as above

Upvotes: 0

Marius Schmack
Marius Schmack

Reputation: 171

I want to define a specific color myself and not let the AppBar do it automatically?

Using SystemChrome will override the Appbar setting.

If you want to set the color yourself use the following function you already mentioned once or in an initstate function.

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
  statusBarColor: Colors.yellow.shade600,
  statusBarBrightness: Brightness.light,
  statusBarIconBrightness: Brightness.dark,
));

This will override the Appbar setting

Upvotes: 1

Related Questions