如何让倒计时时钟在后台运行

Question

我正在尝试创建一个计时器应用程序，该应用程序具有多个用于不同任务的倒数计时器。我面临的问题是，如果我启动一个计时器，然后按返回按钮，计时器就会停止。所以我希望，该计时器一直运行到它被暂停或计时器结束并提醒用户或应用程序被破坏。如何使用 Flutter 做到这一点？

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

class TaskCard extends StatefulWidget {
  final String label;
  final String info;
  final String buttonText;
  TaskCard({this.buttonText, this.info, this.label});

  @override
  State<TaskCard> createState() => _TaskCardState();
}

class _TaskCardState extends State<TaskCard> {
  bool buttonText = true;
  bool buttonPressed = false;

  buttonTask() {
    if (buttonText == false) {
      return RawMaterialButton(
        onPressed: () {},
        child: Padding(
          padding: const EdgeInsets.all(10.0),
          child: SlideCountdownClock(
            duration: Duration(
              minutes: 2,
            ),
            slideDirection: SlideDirection.Up,
            separator: ":",
            textStyle: TextStyle(
              color: Colors.white,
              fontSize: 20,
              fontWeight: FontWeight.bold,
            ),
            onDone: () {
              setState(() {
                buttonText = true;
              });
            },
          ),
        ),
      );
    } else if (buttonText == true) {
      return MaterialButton(
        onPressed: () {
          setState(() {
            buttonText = false;
          });
        },
        child: Text(
          'Get Reward',
          style: TextStyle(
              color: Colors.white, fontWeight: FontWeight.bold, fontSize: 20.0),
        ),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 20),
      child: Container(
          decoration: BoxDecoration(
            border: Border.all(color: Colors.pink[100]),
            color: Colors.white,
            borderRadius: BorderRadius.circular(20),
            boxShadow: [
              BoxShadow(
                  color: Colors.pink[100],
                  offset: Offset(-2, -1),
                  blurRadius: 5),
            ],
          ),
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  widget.label,
                  style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),
                ),
                Padding(
                  padding: const EdgeInsets.all(10.0),
                  child: Text(widget.info,
                      textAlign: TextAlign.justify,
                      style: TextStyle(
                        fontSize: 25,
                      )),
                ),
                Padding(
                  padding: const EdgeInsets.fromLTRB(90, 0, 90, 0),
                  child: Material(
                      borderRadius: BorderRadius.circular(20.0),
                      color: Colors.pinkAccent,
                      child: buttonTask()),
                ),
              ],
            ),
          )),
    );
  }
}

Answer 1

您需要一个单独的单例（在开始时初始化）或全局（更简单）对象来处理您的计时器。我假设你在小部件中声明你的计时器，这对于你想要保留状态的东西来说不是一个很好的地方。