Search code examples
flutterstatusbarflutter-themeflutter-design

Flutter: Change Statusbar Text Color not working properly

Almost all the Q/A referred on Stackoverflow related to the same topic but didn't get proper solutions.

Main Question: My app having the primary color blue and I want to set Statusbar Text Color white.

What I have tried:

  • Using SystemChrome: (Using the following code, It's just changing the color of status bar text in the first screen only, other screens are having blue/black combination background/foreground.)

    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: MaterialColor(0xFF084775, color), // status bar color
    statusBarBrightness: Brightness.light,//status bar brightness
    statusBarIconBrightness:Brightness.light , //status barIcon Brightness
));

Screenshots:

Splash Screen:

enter image description here

Dashboard Screen:

enter image description here

  • Using ThemeData : (This method gives the same result as the above screenshot).

     theme: ThemeData(
            brightness: Brightness.light, // ADDED THIS LINE..
            primarySwatch: MaterialColor(0xFF084775, color),
            accentColor: Color(0xffe46b10),
            unselectedWidgetColor: Colors.grey,
            fontFamily: 'SourceSansPro',
          ),

I have also checked github issue link but not worked for me.

I just need to change Statusbar Text Color to White. Any help?

Solution

  • To apply for all appBar use

     return MaterialApp(
                theme: ThemeData(
                  appBarTheme: Theme.of(context).appBarTheme.copyWith(brightness: Brightness.dark),
                ),
                debugShowCheckedModeBanner: false,
                // home: InvoiceList(),
                home: widget());

    I hope it will works.

    Thank you.