在 Flutter 应用中立即显示应用主题答案

【问题标题】：Display app theme immediately in Flutter app在 Flutter 应用中立即显示应用主题
【发布时间】：2017-06-06 00:58:51
【问题描述】：

鉴于 Flutter shared_prefs 插件的异步特性，如何确保在启动应用程序时立即显示正确的主题设置？ IE。在 shared_prefs 完成加载后，不闪烁默认主题，然后应用正确的主题。

【问题讨论】：

【解决方案1】：

当您的build 方法需要等待Future 时，是突破FutureBuilder 的好时机。

void main() {
  runApp(new FutureBuilder(
    future: SharedPreferences.getInstance(),
    builder: (_, snapshot) {
      return snapshot.hasData ?
             new MyApp(preferences: snapshot.data) :
             new LoadingScreen(); 
    },
  ));
}

使用这种模式构建应用程序的一些技巧：

SharedPreferences.getInstance() 非常快。您的应用程序可能会更好地使用一个空的Container 作为黑色加载屏幕，而不是一闪而过的彩色内容。但是，如果您同时加载其他内容，则显示您的徽标更有意义。
如果需要 await 多个期货，可以使用 Future.wait 或将多个 FutureBuilders 嵌套在一起。

【讨论】：

【解决方案2】：

一种方法是使用加载屏幕来延迟主应用的显示。我见过的一种模式是：

main() async {
  runApp(new LoadingScreen());
  runApp(new App(await asyncStuff()));
}

您可以随意调用 runApp：https://docs.flutter.io/flutter/widgets/runApp.html

【讨论】：

【解决方案3】：

您还可以使用StatefulWidget 和setState 在应用程序配置完成后更新根小部件。

你可以使用类似的东西（简而言之）：

@override
Widget build(BuildContext context) {
    _return mainWidget;
}

结合：

mainWidget = loadingWidget();
someMethodThatDoesAppConfig().then((Widget configuredWidget) {
    setState(() {
        _mainWidget = configuredWidget;
    });
});

【讨论】：

当您处于异步回调中时，您应该在调用 setState 之前检查 if(mounted) 以确保您的小部件尚未被释放。否则 Flutter 会断言。 FutureBuilder 会自动为您执行此操作。在这种特定情况下，它可能没问题，因为 StatefulWidget 靠近应用程序的根目录，不太可能被卸载，但在构建可组合小部件时这是一个好习惯。