更新的值在小部件重绘时被覆盖

Question

我正在玩一个简单的 flutter 倒计时应用程序。它由 2 个页面组成，时钟和一个用于设置要倒计时的分钟和秒的设置页面。

在时钟页面 (HomeWidget) 上，用户单击按钮导航到设置页面。编辑值后，用户按后退硬件键或应用栏中的按钮导航回时钟页面。

class _HomeWidgetState extends State<HomeWidget> {
@override
Widget build(BuildContext context) {
  TimeService _timeService = ScopedModel.of<TimeService>(context);
  SettingsModel _settingsModel = ScopedModel.of<SettingsModel>(context);
  _timeService.setTime(_settingsModel.minutes, _settingsModel.seconds);

return Scaffold( ... display the clock, navigation buttons, etc ... )}

我要理解的问题是，当向后导航时，我在处理倒计时的时间服务 class 中设置了新值。但是在代码示例中，每次重绘时钟（每秒）时都会更新时间服务。倒计时不起作用，值保持不变。它没有显示“10:29”，而是坚持使用“10:30”。我不知道如何处理我的 TimeService class 和我的 SettingsModel class.

之间的依赖关系

如何在用户返回时正确处理时间服务 class 中设置值的分配？ build 方法显然是错误的地方。谁能给我提示？

Answer 1

好的，我找到了解决问题的方法。描述的很详细（还有一些其他的内容）here.

基本上，在页面之间导航时，您可以传递对象。所以现在我只是通过 Navigator.of(context).pop({'newSetting': _settingsModel}); 命令在设置页面上传递编辑的 SettingsModel，然后时钟页面处理结果。我不知道导航是这样工作的。

ControlButtonWidget(
        icon: Icons.settings,
        iconSize: 72.0,
        onPressedHandler: () async {
          Map results = await Navigator.of(context).push(
              new MaterialPageRoute(
                  builder: (context) => SettingsWidget(model)));

          if (results != null && results.containsKey("newSetting")){
            SettingsModel model = results["newSetting"];
            ScopedModel.of<TimeService>(context).setTime(model.minutes, model.seconds);
          }
        })

确保将您的页面包装在 WillPopScope Widget。

@override
Widget build(BuildContext context) {
return new WillPopScope(
    onWillPop: _backRequestedHandler,
    child: LayoutBuilder(builder:
        (BuildContext context, BoxConstraints viewportConstraints) {
      return Scaffold(
          appBar: new AppBar(title: Text("Settings")),
          body: ...

    }));
}

Future<bool> _backRequestedHandler() {
  Navigator.of(context).pop({'newSetting': _settingsModel});
  return new Future.value(true);
}

更新的值在小部件重绘时被覆盖

Updated values get overridden on Widget redraw

navigation

dart

flutter

multi-page-application

scoped-model