Изменить цвет строки состояния для каждого экрана

Question

Я хочу установить цвет строки состояния для каждого экрана. Например, на экране строка состояния имеет красный цвет, а на экране B - синий. Я перепробовал много решений. Но у каждого своя проблема. например:

AnnotatedRegion(
    value: SystemUiOverlayStyle(
        systemNavigationBarColor: navigationBarColor,
        statusBarColor: statusBarColor,
    ),
    child: child,
);

или до возврата в метод сборки:

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
  statusBarColor: Colors.white
));

Моя последняя попытка:

  static void pushNamed({
    BuildContext context,
    String route,
    Object arguments,
    Color statusBarColor,
    Color navigationBarColor = Colors.black,
  }) async {
    if (statusBarColor != null) {
      await FlutterStatusbarcolor.setStatusBarColor(statusBarColor);
    }
    await Navigator.pushNamed(
      context,
      route,
      arguments: arguments,
    );
  }

, но иногда не удается. и другая проблема этого решения заключается в том, что когда используется кнопка «Назад», цвет не изменяется. (Я пишу свой код для кнопки «Назад» в панели приложения). и даже при горячей перезагрузке цвет меняется на предыдущий. Как я могу решить эту проблему?

Обновление # 2

Я создаю класс для своей маршрутизации.

static void pushNamedAndRemoveUntil({
    BuildContext context,
    String route,
    Object arguments,
    Color statusBarColor,
    Color popStatucBarColor,
    Color popNavigationBarColor,
    Color navigationBarColor,
}) async {
    changeSystemColor(statusBarColor, navigationBarColor);
    Navigator.pushNamedAndRemoveUntil(
        context,
        route,
        (Route<dynamic> route) => false,
        arguments: arguments,
    ).then((res) {
        changeSystemColor(popStatucBarColor, popNavigationBarColor);
    });
}

и:

void changeSystemColor(Color statusBarColor, Color navigationBarColor) {
  if (statusBarColor != null)
    SystemChrome.setSystemUIOverlayStyle(
      SystemUiOverlayStyle(
        systemNavigationBarColor: navigationBarColor ?? Colors.black,
        statusBarColor: statusBarColor,
      ),
    );
}

и для использования этого

Routing.pushNamedAndRemoveUntil(
    context: context,
    route: Routes.homeScreen,
    arguments: user,
    statusBarColor: Colors.teal,
);

и теперь не работают при использовании pushNamedAndRemoveUntil.

Answer 1

Вы не можете вызвать изменение системного цвета в initState или любом другом методе жизненного цикла Stateful Widget. Наилучшим способом, по-видимому, является установка цвета перед переходом к новому виду и при возврате из этого вида:

void goToWhiteView(){
  changeSystemColor(Colors.white);
  Navigator.pushNamed(
    context,
    route,
    arguments: arguments,
  ).then((result){
    changeSystemColor(Colors.blue);
  });
}

void changeSystemColor(Color color){
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    systemNavigationBarColor: color,
    statusBarColor: color
  ));
}

Answer 2

Вы можете использовать панель приложений, но установить ее высоту и высоту на 0, чтобы она покрывала только строку состояния и не имела тени.

appBar: PreferredSize(
                preferredSize: Size.fromHeight(0),
                child: new AppBar(
                        brightness: Brightness.light,
                        backgroundColor: backgroundColour,
                        elevation: 0,
                )
),

Затем в initState() вы можете сделать строка состояния прозрачна, поэтому она не будет обесцвечена.

Вам необходимо позвонить до и после ваших await Navigator.push() вызовов.

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
   statusBarColor: desiredColour
));