Флаттер: Как изменить яркость темы во время выполнения?

Question

У меня есть MaterialApp с ThemeData, который изначально установлен на Brightness.light. Я хотел бы изменить яркость на Brightness.dark во время выполнения, но когда я делаю это изменение, меняется только строка состояния - ни один из виджетов Flutter на самом деле не меняет свою яркость.

Как можно добиться такого поведения?

Чтобы изменить ThemeData во время выполнения, я создал следующий StatefulWidget, который оборачивает мой MaterialApp и перестраивает его при каждом изменении темы:

final ThemeData appTheme = ThemeData(
  brightness: Brightness.light,
);

class ThemeChanger extends StatefulWidget {
  static ThemeChangerState of (BuildContext context) {
    return context.ancestorStateOfType(TypeMatcher<ThemeChangerState>());
  }

  ThemeChanger({
    this.childBuilder,
  });

  final Widget Function(BuildContext, ThemeData) childBuilder;

  @override
  ThemeChangerState createState() => ThemeChangerState();
}

class ThemeChangerState extends State<ThemeChanger> {
  Brightness _brightness = Brightness.light;

  set brightness(Brightness brightness) {
    setState(() {
      _brightness = brightness;
    });
  }

  @override
  Widget build(BuildContext context) {
    return widget.childBuilder(
      context,
      appTheme.copyWith(
        brightness: _brightness
      ),
    );
  }
}

// Then in main.dart
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return DemoTheme(
      childBuilder: (BuildContext context, ThemeData theme) {
        return MaterialApp(
          title: 'Materially Better',
          theme: theme,
          routes: {
            '/': (BuildContext context) {
              return LoginScreen();
            },
            'home': (BuildContext context) {
              return MainScreen();
            }
          },
          debugShowCheckedModeBanner: false,
        );
      },
    );
  }
}

Answer 1

Вы можете проверить следующую библиотеку: https://github.com/Norbert515/dynamic_theme

Позволяет динамически изменять все данные темы или яркость вашего приложения во время выполнения.

Answer 2

Проблема в том, что ThemeData использует свое значение brightness в конструкторе для синтеза ряда других цветов, но эти цвета не пересчитываются при мутации ThemeData. Поэтому решение состоит в том, чтобы создать совершенно новый ThemeData вместо использования appTheme.copyWith(...).

Изменить это:

appTheme.copyWith(
  brightness: _brightness,
),

К этому:

ThemeData(
  brightness: _brightness,
),