Flutter/Dart 在继续之前没有完全构建小部件答案

【问题标题】：Flutter/Dart doesn't completely build widget before moving onFlutter/Dart 在继续之前没有完全构建小部件
【发布时间】：2020-06-23 05:12:42
【问题描述】：

我对颤振相当陌生，所以如果这是一个简单的问题，我很抱歉。无论如何，我的应用程序上有一个屏幕，它是一个有状态的小部件。据我了解，当调用 setState() 函数时，有状态小部件会立即更改状态。这样做会立即调用 build() 函数。

但是，当我的代码运行下面的函数（为按钮调用 onPressed）时，它会运行整个函数，然后更改状态。

  void buttonPressed() {
    if (formKey.currentState.validate()) {
      setState(() {
        isLoading = true;
      });

      sleep(Duration(seconds: 3));
      Navigator.pushReplacement(context, MaterialPageRoute(
        builder: (context) => NextScreen(),
      ));
    }
  }

我要做的是实现一个传统的加载图标，该图标会旋转 3 秒（在这种情况下），然后再转到下一个屏幕。然而，当我运行它时，实际发生的情况是应用程序完全停止了 3 秒，显示加载图标只有几分之一秒，然后移动到 NextScreen()。

我尝试通过将 sleep() 和 Navigator.pushReplacement() 行放在单独的方法中来解决这个问题（以防调用堆栈出现问题）。这也不起作用。

任何想法为什么会发生这种情况和/或我如何解决它。任何建议都有帮助，谢谢！

【问题讨论】：

标签： flutter dart

【解决方案1】：

尝试将您的加载图标包装在计时器中，因此我为我正在处理的显示倒计时的项目做了一些类似的事情。

 StartTimer() {
    const oneSec = const Duration(seconds: 1);
    _timer = new Timer.periodic(
      oneSec,
      (Timer timer) => setState(
        () {
          if (_start < 1) {
            alarmState = StateOfAlarm.Listening;
            buttonText = "Movement alarm active";
            _lockPhone();
            _startListening();

            timer.cancel();
          } else {
            _start = _start - 1;
            buttonText = _start.toString();
          }
        },
      ),
    );
  }

【讨论】：

【解决方案2】：

我想做的是实现一个传统的加载图标在继续下一个之前旋转 3 秒（在这种情况下）屏幕。

这不是传统加载图标的作用。加载图标在您等待某事完成时显示为占位符，在您执行/开始某事之前暂时不显示。

我假设您想在下一页加载时显示加载指示器。在这种情况下，您需要控制下一页上的指示器。

所以，把你的函数改成

void buttonPressed() {
  if (formKey.currentState.validate()) {
    Navigator.pushReplacement(context, MaterialPageRoute(
      builder: (context) => NextScreen(),
    ));
  }
}

然后，在 NextScreen 上

声明并将isLoading初始化为true

完成后将需要等待的进程设置为 false

然后，在小部件构建中，使用三元条件来显示进度指示器或真正的小部件

【讨论】：