1

I am using white background for App Bar in flutter and how can I change the status bar icon colors to black,

I am using this code to change the status bar color,

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark.copyWith(
  statusBarColor: Colors.white,
  statusBarIconBrightness: Brightness.light,
));
afsal.an
  • 499
  • 2
  • 6
  • 13

3 Answers3

5

Flutter 2.4.0+ UPDATE

Since flutter 2.4.0 brightness: Brightness.dark is deprecated.

It has been replaced by systemOverlayStyle: SystemUiOverlayStyle.dark

How to use:

import 'package:flutter/services.dart';

appBar: AppBar(
    systemOverlayStyle: SystemUiOverlayStyle.dark,
    elevation: 0.0,
),

Set SystemUiOverlayStyle.dark if you want black icons.

Set SystemUiOverlayStyle.light if you want white icons.

BradG
  • 673
  • 1
  • 14
  • 26
3

Hi, in my project, I use the following (use Brightness was obsolete)

Without AppBar:
return AnnotatedRegion<SystemUiOverlayStyle>(
            //Set status bar icon color
            value: your_condition
                ? SystemUiOverlayStyle.dark.copyWith(
                    statusBarColor: your_color,
                    //statusBarIconBrightness: Brightness.light,
                  )
                : SystemUiOverlayStyle.light.copyWith(
                    statusBarColor: your_color,
                    //statusBarIconBrightness: Brightness.light,
                  ),
            child: your_widget);
With AppBar:
return AppBar(
    elevation: 0.0,
    systemOverlayStyle: your_condition ? SystemUiOverlayStyle.dark : SystemUiOverlayStyle.light,
    backgroundColor: your_color,
);
  • You can use a combination of the two methods above to achieve your goal
Gome
  • 124
  • 5
0

You also need to set to brightness in AppBar if you are using one. Eg.

appBar: AppBar(
        backgroundColor: Colors.white,
        brightness: Brightness.dark,
),

You can checkout detailed answer here: How to change status bar color in Flutter?

Urvesh
  • 61
  • 4