Flutter计时器完成后自动重启功能故障修复请求

问题分析 #

• 原代码在initState里同时调用startTimer()和restartTimer()，导致初始计时器被直接取消，无法正常执行倒计时。
• 当倒计时到0时，仅调用setState()，没有停止当前计时器，也未触发重启逻辑，会导致定时器持续空跑。

修复后的完整代码 #

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

class TimerPage extends StatefulWidget {
  const TimerPage({super.key});

  @override
  State<TimerPage> createState() => _TimerPageState();
}

class _TimerPageState extends State<TimerPage> {
  int _start = 7; // 初始倒计时时长
  Timer? _timer;
  int? selectedValue;

  void startTimer() {
    const oneSec = Duration(seconds: 1);
    _timer = Timer.periodic(
      oneSec,
      (Timer timer) {
        if (_start == 0) {
          timer.cancel(); // 停止当前计时器
          restartTimer(); // 触发重启逻辑
        } else {
          setState(() {
            _start--;
          });
        }
      },
    );
  }

  void restartTimer() {
    setState(() {
      _start = 7; // 重置为初始时长，可按需修改为其他值
    });
    startTimer(); // 启动新的计时器
  }

  @override
  void initState() {
    super.initState();
    startTimer(); // 初始化仅启动一次计时器
  }

  @override
  void dispose() {
    _timer?.cancel(); // 页面销毁时取消计时器，避免内存泄漏
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Text(
          '$_start',
          style: const TextStyle(fontSize: 48),
        ),
      ),
    );
  }
}

关键修复点 #

1. 计时器结束逻辑：当_start归0时，先取消当前计时器，再调用restartTimer()完成重置和重启。
2. 初始化优化：initState中仅调用startTimer()，移除多余的restartTimer()调用，保证初始倒计时正常执行。
3. 内存泄漏防护：补充dispose()方法，在页面销毁时取消计时器。
4. 重启逻辑简化：无需重复判断_timer是否为空，因为倒计时结束时已经主动取消了当前计时器。

内容的提问来源于stack exchange，提问作者alex