[タスク] ステータスバーの色を変更する

[p238049y]

目的

• ステータスバーの色を変更する
• 戻るボタンを実装している画面のみステータスバーの色が背景と同化している

方針

systemOverlayStyleを指定する

class Widget1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.black,
        systemOverlayStyle: SystemUiOverlayStyle(
          statusBarBrightness: Brightness.light, // for iOS
          statusBarIconBrightness: Brightness.dark, // for Android
        ),
      ),
      body: Container(color: Colors.white),
    );
  }
}

期待結果

• 戻るボタンを実装している画面のみステータスバーの色が背景色と同化していないこと

参考

【Flutter】ステータスバーの文字色変更の挙動について

[p238049y]

AppBarを使ってステータスバーの文字色が決定される優先度は下記の通り

1. AppBarのsystemOverlayStyleプロパティ
2. MaterialAppに設定するAppBarThemeのsystemOverlayStyleプロパティ
3. AppBarのbackgroundColorプロパティ

[p238049y]

動作確認

https://user-images.githubusercontent.com/82100625/211325491-6c641be2-b086-42ab-b309-c37b76f39606.MOV