Flutter实现mm:ss(分秒)倒计时组件

倒计时组件：

import 'dart:async';
import 'dart:developer';

import 'package:flutter/cupertino.dart';

//分：秒倒计时器
class CountDownWidget extends StatefulWidget {
  final String validTime;
  final double? textSize;
  final Color? textColor;
  final ValueChanged<bool>? isFinish;
  //CountDownWidget(this.validTime, {this.textSize});
  const CountDownWidget(this.validTime,
      {Key? key, this.textSize, this.textColor, this.isFinish})
      : super(key: key);
  @override
  State<StatefulWidget> createState() {
    return _CountDownWidgetState();
  }
}

class _CountDownWidgetState extends State<CountDownWidget> {
  var _timer;
  @override
  void dispose() {
    if (_timer.isActive) {
      _timer.cancel();
    }
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // log("_timerString    240000");
    if (widget.validTime.isEmpty) {
      return Container();
    }
    int endTime = int.parse(widget.validTime);
    //数字格式化，将 0~9 的时间转换为 00~09
    DateTime now = DateTime.now();
    //把后台返回的结束时间换为DateTime类型
    DateTime endTimeDate = DateTime.fromMillisecondsSinceEpoch(endTime);
    //和当前时间相减
    Duration difference = endTimeDate.difference(now);
    //获取运算完成的时间
    int computingTime = difference.inSeconds;
    String computingTimeDate = constructFirstTime(computingTime);
    var txtArray = computingTimeDate.split(",");
    late String textContext = constructTime(computingTime);

    if (computingTime < 0) {
      textContext = "计时结束";
      if (widget.isFinish != null) {
        widget.isFinish!(true);
      }

      return Text(
        '计时结束',
        style: TextStyle(
            fontSize: widget.textSize != null ? widget.textSize : 12.0,
            color: widget.textColor != null
                ? widget.textColor
                : CupertinoDynamicColor.resolve(
                    CupertinoColors.systemRed, context)),
      );
    } else {
      if (int.parse(txtArray[0]) > 0) {
        return Text(
          '59:59',
          style: TextStyle(
              fontSize: widget.textSize != null ? widget.textSize : 12.0,
              color: widget.textColor != null
                  ? widget.textColor
                  : CupertinoDynamicColor.resolve(
                      CupertinoColors.systemRed, context)),
        );
      } else {
        if (computingTime > 0) {
          _timer = Timer.periodic(Duration(seconds: 1), (timer) {
            if (computingTime > 0) {
              String computingTimeDate = constructTime(computingTime);
              textContext = computingTimeDate;
              setState(() {});
              timer.cancel();
            } else {
              timer.cancel();
              textContext = '计时结束';
              if (widget.isFinish != null) {
                widget.isFinish!(true);
              }

              setState(() {});
            }
          });
        } else {
          if (widget.isFinish != null) {
            widget.isFinish!(true);
          }

          return Text(
            '计时结束',
            style: TextStyle(
                fontSize: widget.textSize != null ? widget.textSize : 12.0,
                color: widget.textColor != null
                    ? widget.textColor
                    : CupertinoDynamicColor.resolve(
                        CupertinoColors.systemRed, context)),
          );
        }
      }

      return Text(
        textContext,
        style: TextStyle(
            fontSize: widget.textSize != null ? widget.textSize : 12.0,
            color: widget.textColor != null
                ? widget.textColor
                : CupertinoDynamicColor.resolve(
                    CupertinoColors.systemRed, context)),
      );
    }
  }

  String formatTime(int timeNum) {
    return timeNum < 10 ? "0" + timeNum.toString() : timeNum.toString();
  }

  String constructFirstTime(int seconds) {
    int hour = seconds ~/ 3600;
    int minute = seconds % 3600 ~/ 60;
    int second = seconds % 60;
    return formatTime(hour) +
        "," +
        formatTime(minute) +
        ":" +
        formatTime(second);
  }

  String constructTime(int seconds) {
    int minute = seconds % 3600 ~/ 60;
    int second = seconds % 60;
    return formatTime(minute) + ":" + formatTime(second);
  }
}

 

调用方式：

                 CountDownWidget(
                          "1632384385823",
                          textSize: 14,
                          textColor: Colors.white,
                          isFinish: (e) {
                            if (e) {
                              //计时结束
                            }
                          },
                        )