【Flutter】StatusBarの色変更をAndroidとiOS両方に対応させる

問題点

こちらがよくあるStatusBarの色の変更方法だと思います。
しかし、この方法だとAndroidには反映されるものの、iOSには反映されません。

SystemChrome.setSystemUIOverlayStyle(
    const SystemUiOverlayStyle(
      statusBarColor: <任意のステータスバーの色>,
    ),
);

解決方法

カスタムAppBarを作成し、Stackを使ってStatusBarの高さ分のContainerをAppBarに被せる

class CustomAppBar extends StatelessWidget implements PreferredSizeWidget {
  const CustomAppBar({super.key});

  @override
  Widget build(BuildContext context) {
    final statusBarHeight = MediaQuery.of(context).viewPadding.top;

    return Stack(
      children: [
        AppBar(),
        // StatusBarサイズの色付きContainer
        Container(
          width: double.infinity,
          height: statusBarHeight,
          color: <任意のステータスバーの色>,
        ),
      ],
    );
  }

  @override
  Size get preferredSize {
    return const Size.fromHeight(kToolbarHeight);
  }
}