在运行时更改应用程序主题

尼拉夫·玛达里亚(Nirav Madariya)

我是Flutter的初学者。如何将整个应用程序主题从浅色主题更改为深色主题?

假设我有以下Light Theme代码:

final ThemeData dTheme = new ThemeData(
  primarySwatch: Colors.orange,
  primaryColor: Colors.orangeAccent[100],
  primaryColorBrightness: Brightness.light,
);

和黑暗主题:

final ThemeData lTheme = new ThemeData(
  primarySwatch: Colors.indigo,
  primaryColor: Colors.indigoAccent[100],
  primaryColorBrightness: Brightness.dark,
);

我想在运行时单击按钮来更改主题。

阿尔巴兹·阿拉姆

这是在此处回答问题的特定情况:强制Flutter重新绘制所有小部件

看一下该问题中提到的Stocks示例,特别注意以下内容:https : //github.com/flutter/flutter/blob/master/examples/stocks/lib/main.dart https://github.com/ flutter / flutter / blob / master / examples / stocks / lib / stock_settings.dart

请注意以下几点:

  1. 主题是从指定的_configuration,由更新configurationUpdater
  2. configurationUpdater 传递给需要它的应用程序的子级
  3. 孩子们可以调用该configurationUpdater,后者依次在应用程序的根目录下设置状态,然后使用指定的主题重新绘制应用程序

下面的代码可能会帮助您:

// How to use: Any Widget in the app can access the ThemeChanger
// because it is an InheritedWidget. Then the Widget can call
// themeChanger.theme = [blah] to change the theme. The ThemeChanger
// then accesses AppThemeState by using the _themeGlobalKey, and
// the ThemeChanger switches out the old ThemeData for the new
// ThemeData in the AppThemeState (which causes a re-render).

final _themeGlobalKey = new GlobalKey(debugLabel: 'app_theme');

class AppTheme extends StatefulWidget {

  final child;

  AppTheme({
    this.child,
  }) : super(key: _themeGlobalKey);

  @override
  AppThemeState createState() => new AppThemeState();
}

class AppThemeState extends State<AppTheme> {

  ThemeData _theme = DEV_THEME;

  set theme(newTheme) {
    if (newTheme != _theme) {
      setState(() => _theme = newTheme);
    }
  }

  @override
  Widget build(BuildContext context) {
    return new ThemeChanger(
      appThemeKey: _themeGlobalKey,
      child: new Theme(
        data: _theme,
        child: widget.child,
      ),
    );
  }
}

class ThemeChanger extends InheritedWidget {

  static ThemeChanger of(BuildContext context) {
    return context.inheritFromWidgetOfExactType(ThemeChanger);
  }

  final ThemeData theme;
  final GlobalKey _appThemeKey;

  ThemeChanger({
    appThemeKey,
    this.theme,
    child
  }) : _appThemeKey = appThemeKey, super(child: child);

  set appTheme(AppThemeOption theme) {
    switch (theme) {
      case AppThemeOption.experimental:
        (_appThemeKey.currentState as AppThemeState)?.theme = EXPERIMENT_THEME;
        break;
      case AppThemeOption.dev:
        (_appThemeKey.currentState as AppThemeState)?.theme = DEV_THEME;
        break;
    }
  }

  @override
  bool updateShouldNotify(ThemeChanger oldWidget) {
    return oldWidget.theme == theme;
  }

}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

在运行时更改Polymer应用程序的主题

在运行时更改应用程序MainForm

在运行时更改应用程序语言

可以在运行时更改argv(不能由应用程序本身更改)

在运行时更改主题

在 ASP.NET Core Angular 应用程序运行时更改主题的热门话题

更改compileSdkVersion是否会影响应用程序在运行时的行为?

如何在运行时更改应用程序环境?

如何保护Flash应用程序免于在运行时更改系统时间

如何在运行时更改应用程序输出类型

在运行时从服务器更改应用程序图标

在Spring Boot应用程序中在运行时更改日志记录级别

基于SAP Java Buildpack的cf应用程序在运行时更改日志级别

如何在运行时更改android应用程序的名称和图标?

在应用程序仍在运行时更改 Tkinter 标签

在运行时检测 MSIX 打包的应用程序

在运行时设计 Angular 应用程序的样式

Web应用程序:在运行时删除文件

如何在单击时在运行时为整个应用程序设置自定义主题?

在应用程序运行时更改属性文件

JavaFX:运行时更改应用程序语言

如何通过Spring Boot应用程序和Spock测试在运行时更改服务器端口

如何在运行时更改Safari应用程序扩展中的工具栏图标?

如何使用Swift在运行时使我的应用程序表现得就像我在更改Application is agent(UIElement)?

在iOS Swift中进行本地化。我如何在运行时更改应用程序语言

在运行时动态更改Angular 7中的语言环境,而无需重新加载应用程序

在运行时更改应用程序大小时,为什么要停止数据传输?

Flutter:如何在运行时更改MaterialApp主题

在运行时动态更改QML主题