如何防止AppBar覆盖自定义状态栏颜色

Question

我似乎无法更改状态栏颜色，因为AppBar一直在覆盖它。

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(), // this component sets a status bar color and brightness
    body: AnnotatedRegion<SystemUiOverlayStyle>( // this component fails to
                                                 // override the status bar color
                                                 // and brightness set by the AppBar
      value: SystemUiOverlayStyle(
        statusBarColor: Colors.blue,
        statusBarIconBrightness: Brightness.light
      ),
      child: Container()
    )
  );
}

当我注释掉AppBar时，状态颜色变为蓝色。当我取消注释时，状态栏颜色保持蓝色，但是无法再次更改。似乎AppBar锁定了当前颜色。

在子小部件中，我在返回组件之前尝试使用setSystemUIOverlayStyle，但这无济于事：

Widget build(BuildContext context) {
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: Colors.blue,
    statusBarIconBrightness: Brightness.light
  ));
  return Container();
}

有AppBar时如何设置状态栏颜色？

Answer 1

用SafeArea包装您的根窗口小部件
有关小部件click here

的更多详细信息