如何動態自動更新日期和時間

我有一個 DateTime 物件，該物件已格式化為字串以僅顯示時間。我應該怎么做才能讓時間自動更新。任何幫助將非常感激。

Widget build(BuildContext context) {
    String formattedTime = DateFormat('kk:mm').format(DateTime.now());
    String hour = DateFormat('a').format(DateTime.now());
return Scaffold(
  body: Column(
    crossAxisAlignment: CrossAxisAlignment.end,
    children: [
      Container(
        child: Padding(
          padding: const EdgeInsets.only(top: 20.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(formattedTime,
                  style: GoogleFonts.lato(
                      fontSize: 80.0,
                      color: Colors.blue,
                      fontStyle: FontStyle.normal,
                      letterSpacing: 5.0)),
              Padding(
                padding: const EdgeInsets.only(top: 41.0, left: 10.0),
                child: Text(
                  hour,
                  style: GoogleFonts.lato(
                    color: Colors.blue,
                    fontSize: 30.0,
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    ],
  ),
);
}

uj5u.com熱心網友回復：

假設您不需要顯示毫秒，您可以簡單地將 Timer 添加到每 500 毫秒觸發一次的小部件的狀態，并傳遞一個函式來更改您存盤格式化時間的字串。此外，如果您希望它作業，您必須將兩個字串移出構建方法并將它們作為有狀態小部件的屬性。

我找到了一些時間并編輯了您的代碼

class Clock extends StatefulWidget {
  const Clock({Key? key}) : super(key: key);

  @override
  _ClockState createState() => _ClockState();
}

class _ClockState extends State<Clock> {
  String formattedTime = DateFormat('kk:mm').format(DateTime.now());
  String hour = DateFormat('a').format(DateTime.now());
  late Timer _timer;

  @override
  void initState() {
    super.initState();
    _timer = Timer.periodic(const Duration(milliseconds: 500), (timer) => _update());
  }

  void _update() {
    setState(() {
      formattedTime = DateFormat('kk:mm').format(DateTime.now());
      hour = DateFormat('a').format(DateTime.now());
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        children: [
          Container(
            child: Padding(
              padding: const EdgeInsets.only(top: 20.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(formattedTime, style: GoogleFonts.lato(fontSize: 80.0, color: Colors.blue, fontStyle: FontStyle.normal, letterSpacing: 5.0)),
                  Padding(
                    padding: const EdgeInsets.only(top: 41.0, left: 10.0),
                    child: Text(
                      hour,
                      style: GoogleFonts.lato(
                        color: Colors.blue,
                        fontSize: 30.0,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

uj5u.com熱心網友回復：

使用 timer.period 延遲 1 分鐘可能會解決您的問題。將此代碼段粘貼到您的構建方法上方。

@override
  void initState() {
    Timer.periodic(Duration(minutes: 1), (timer) {
      setState(() {
        formattedTime = DateFormat('kk:mm').format(DateTime.now());
        hour = DateFormat('a').format(DateTime.now());
      });
    });
    super.initState();
  }

標籤：

上一篇：如何為我使用Scala保存到S3的CSV檔案指定名稱

下一篇：結合兩個資料框（一個應該有一個縮小的日期，另一個有一個每日日期）