Flutter多按钮点击重置计时器问题：点击后重新开始10秒计时

问题核心是每次点击按钮时，旧的延迟任务没有被终止，导致10秒后依然会执行状态修改。改用Timer替代Future.delayed，因为Timer支持取消操作，能实现每次点击重置计时。

修改步骤： #

1. 在你的State类中添加一个Timer成员变量，用于存储当前运行的计时器：

Timer? _timer;

2. 重构changeActiveStatus方法，每次调用时先取消旧计时器，再启动新的：

void changeActiveStatus() {
  // 取消之前的计时器（如果存在且未完成）
  _timer?.cancel();

  // 立即激活标签
  setState(() {
    isTagActive = true;
  });

  // 启动新的10秒计时器
  _timer = Timer(const Duration(seconds: 10), () {
    if (mounted) {
      setState(() {
        isTagActive = false;
      });
      // 计时器结束后清空引用
      _timer = null;
    }
  });
}

3. （可选但推荐）在组件销毁时取消计时器，避免内存泄漏：

@override
void dispose() {
  _timer?.cancel();
  super.dispose();
}

代码说明： #

• 每次点击按钮调用changeActiveStatus时，先通过_timer?.cancel()终止之前未完成的计时任务，确保旧任务不会再修改状态。
• 重新设置isTagActive为true并更新UI。
• 启动新的10秒计时器，时间到后将isTagActive设为false，同时清空_timer引用。
• mounted判断用于避免组件销毁后调用setState引发错误。

这样不管用户点击哪个按钮、点击间隔多久，都会重新开始10秒的计时，达到需求效果。

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