如何使用 AnnotatedRegion 更改状态栏颜色？

Question

我想使用更改状态栏的颜色，我从这个答案AnnotatedRegion中得到了以下代码，但它对状态栏颜色没有影响。

AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.light.copyWith(statusBarColor: Colors.white),
      child: Scaffold(
        appBar: AppBar(
          title: Text('Annotated Region'),
        ),
        body: Center(
          child:
              Text('Status Bar!'),
        ),
      ),
    )

要快速开始使用此代码，您可以使用此 Github 存储库。

Answer 1

如果您检查 Appbar 的代码，您将看到它使用自己的 AnnotatedRegion

final SystemUiOverlayStyle overlayStyle = brightness == Brightness.dark
      ? SystemUiOverlayStyle.light
      : SystemUiOverlayStyle.dark;

return Semantics(
      container: true,
      child: AnnotatedRegion<SystemUiOverlayStyle>(
        value: overlayStyle,
        child: Material(
          color: widget.backgroundColor
            ?? appBarTheme.color
            ?? theme.primaryColor,
          elevation: widget.elevation
            ?? appBarTheme.elevation
            ?? _defaultElevation,
          shape: widget.shape,
          child: Semantics(
            explicitChildNodes: true,
            child: appBar,
          ),
        ),
      ),
    );

要覆盖 Appbar 的效果，您需要用 SafeArea 包裹脚手架，然后您将看到自己的 AnnotatedRegion 的变化

return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.light.copyWith(statusBarColor: Colors.white),
      child: SafeArea(
        child: Scaffold(
          primary: false,
          appBar: AppBar(
            title: Text('Annotated Region'),
          ),
          body: Center(
            child: Text('Status Bar!'),
          ),
        )
      )
    );