Блог

У меня есть контейнер, который отображает номер. Я хочу, чтобы после того, как я нажму кнопку «Перемешать», через 1000 миллисекунд отобразилось 10 чисел каждое. К сожалению, через 10 секунд отображается только последний сгенерированный номер.

 ElevatedButton(
  onPressed: () {
    for (int i = 0; i <= 10; i  ) {
      setState(() {
        randomNum = Random().nextInt(19)   1;
      });
      sleep(Duration(milliseconds: 1000));
    }
  },
  child: const Text('Shuffle')),
 

Вы не должны использовать sleep для задержки в приложении flutter (в целом).

sleep() блокирует текущую изоляцию (примерно аналогично потоку). Это означает, что, пока sleep() это происходит, ничего другого на этом изоляторе произойти не может. В приложении flutter это также означает, что оно не будет обновляться до sleep() завершения.

Вместо этого вы можете использовать Future.delayed(duration) асинхронное ожидание в течение определенного времени. Вместо того, чтобы останавливать все выполнение в текущем изолированном режиме, Future.delayed позволяет выполнять действия в фоновом режиме (включая обновления пользовательского интерфейса) и возобновляется по истечении времени.

Чтобы на самом деле дождаться продолжительности, вы должны создать свою функцию async , которая позволяет использовать await ключевое слово для фактического ожидания этого времени. Например:

 onPressed: () async {  // mark function as async to allow await
  for (int i = 0; i < 10; i  ) {
    setState(() { ... });  // set randomNum
  }
  await Future.delayed(Duration(seconds: 1));  // notice the await keyword
}
 

Это позволит Flutter перекрасить пользовательский интерфейс во время работы вашей функции.

P.S. Если вы используете supercharged пакет, вы можете использовать:

 await 1.seconds.delay;
 

вместо

 await Future.delayed(Duration(seconds: 1));