Question

我正在尝试为特殊的日子（例如11 d 2 h 30 m 23s到新年）构建倒计时应用程序，但是我无法每秒重新加载状态，因此它仅显示我加载页面的第二秒不知道如何动态重新加载页面。

 import 'package:flutter/material.dart';

    class RopSayac extends StatefulWidget {
      _RopSayacState createState() => _RopSayacState();
    }

    class _RopSayacState extends State<RopSayac> {

      var now = DateTime.now().second.toString();
      String asd(){
        setState(() {
        now = DateTime.now().second.toString();

        });
        return now;
      }

      @override
      Widget build(BuildContext context) {


        return Container(
          child: new Text(asd()),
        );
      }
    }

这就是我得到的，并且不会重新加载时间。我在扑扑中很新。

Answer 1

如pskink和Günter所述，请使用Timer。您甚至可以使用适合您的情况的periodic构造函数。

请注意，您不需要asd()函数。调用setState()时，将自动传递新的build属性值来调用now方法。

如果需要，请使用initState设置一个初始值，然后如本例所示，设置Timer。

import 'dart:async';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(title: 'Timer Periodic Demo', home: RopSayac());
  }
}

class RopSayac extends StatefulWidget {
  _RopSayacState createState() => _RopSayacState();
}

class _RopSayacState extends State<RopSayac> {
  String _now;
  Timer _everySecond;

  @override
  void initState() {
    super.initState();

    // sets first value
    _now = DateTime.now().second.toString();

    // defines a timer 
    _everySecond = Timer.periodic(Duration(seconds: 1), (Timer t) {
      setState(() {
        _now = DateTime.now().second.toString();
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: new Text(_now),
      ),
    );
  }
}

Answer 2

此递归方法应足以满足您的需求。设置为1的seconds将继续每秒触发setState，从而刷新窗口小部件树。

void _timer() {
    Future.delayed(Duration(seconds: 1)).then((_) {
      setState(() {
        print("1 second closer to NYE!");
        // Anything else you want
      });
      _timer();
    });
  }

Answer 3

有一个名为timer_builder的出色库。我想这会帮到你。

发布页面上的示例：

import 'package:timer_builder/timer_builder.dart';

class ClockWidget extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return TimerBuilder.periodic(Duration(seconds: 1), //updates every second
      builder: (context) {
        return Text("${DateTime.now()}");
      }
    );
  }

}

Answer 4

这就是我的工作。就我而言，我正在_liveUpdate（）中轮询Web服务

void startUpdates(AppState appState) async {
await new Future.delayed(const Duration(milliseconds: 100));
while (true) {
  _liveUpdate();
  appState.setState(() {});

  await new Future.delayed(const Duration(seconds : 15));
}

如何每秒设置状态

4 个答案: