How to make device top panel (status bar) have the same background color as AppBar in flutter?

Question

How to make device top panel (status bar) have the same background color as AppBar in flutter? The color of the device top panel is always darker than the AppBar backgroundC

Answer 1

Here is a flutter specific solution. In the build method, you can use the flutter service package.

import 'package:flutter/services.dart';
Widget build(BuildContext context) {
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.transparent, //top bar color
      statusBarIconBrightness: Brightness.dark, //top bar icons
      systemNavigationBarColor: Colors.white, //bottom bar color
      systemNavigationBarIconBrightness: Brightness.dark, //bottom bar icons
    ));

//....
}