how to apply color to statusbar in flutter?

Question

i want to change statusbar color to white. but it loos like gray. i use safeArea, and not use appbar. so i wrap safearea in Container to set color to white.

@override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white, // statusbar color
      child: SafeArea(
          child: Scaffold(
        backgroundColor: Theme.of(context).scaffoldBackgroundColor,
        body: Column(
          children: [
            appBarContainer(),
            Expanded(
              child: GetX<PostDetailController>(
                builder: (controller) {
                  return Scrollbar(
                      child: ListView.builder(
                    itemBuilder: (context, index) {
                      return postContainer(context, controller);
                    },
                    itemCount: controller.post.length,
                  ));
                },
              ),
            )
          ],
        ),
      )),
    );
  }
}

Does this answer your question? [How to change status bar color in Flutter?](https://stackoverflow.com/questions/52489458/how-to-change-status-bar-color-in-flutter) — Nagual, Jul 15 '22 at 12:29

score 2 · Accepted Answer · answered Jul 15 '22 at 11:36

2

refer below code and add this in void main() before runApp

SystemChrome.setSystemUIOverlayStyle(
  const SystemUiOverlayStyle(
    statusBarColor: Colors.transparent,      // status bar color
  ),
);

answered Jul 15 '22 at 11:36

Pathik Patel

1,347
1
9
22

score 0 · Answer 2 · answered Jul 15 '22 at 11:36

0

 void main() {
  SystemChrome.setSystemUIOverlayStyle(
  SystemUiOverlayStyle(statusBarColor: Colors.red));
   
   WidgetsFlutterBinding.ensureInitialized();
    runApp(const MyApp());
  }

this how you can add color to status bar

answered Jul 15 '22 at 11:36

Ali Hassan

691
5
11

how to apply color to statusbar in flutter?

2 Answers2