Flutter列表中倒计时

小蜜蜂嗡嗡

已于 2023-04-17 11:25:12 修改

阅读量918

点赞数

CC 4.0 BY-SA版权

文章标签： flutter android

于 2022-12-01 15:38:28 首次发布

本文链接：https://blog.youkuaiyun.com/androidhyf/article/details/128132932

本文介绍了两种不同的倒计时列表实现方式：一种适用于不同时间跨度的倒计时列表，每项都有独立的计时器；另一种适用于相同时间跨度的倒计时列表，所有项共享一个计时器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.列表中有不同时间跨度倒计时的列表
在实体类中增加Timer类型的字段，使在每个item中添加一个Timer，缺点是耗性能

bean{
Timer timer;
  var countdownSeconds;//倒计时剩余秒数
  String showTimeName;//显示在item中的字符串
}

2、在获取到接口数据后开启倒计时

_httpExpressList(){
    HttpApplication.getInstance().expressList(callBack: (result){
      if(result !=null){
        var dataList = result['list'] as List;
        var dateNo = DateTime.now();
        for(int i = 0; i< dataList.length; i++){
          PromotionExpressItemBean _promotionExpressItemBean = PromotionExpressItemBean.fromJson(dataList[i]);
          var diff = DateCountDownUtil.difference(_promotionExpressItemBean.endTime,dateNo);
          _promotionExpressItemBean.countdownSeconds = diff;
          _promotionExpressItemBean.timer = _startTimer(_promotionExpressItemBean);
          _promotionExpressList.add(_promotionExpressItemBean);
        }
        setState(() {});
      }

    },errorCallBack: (error){});
  }

_cancelTimer(){
    if(_promotionExpressList.length>0){
      for(int i =0;i<_promotionExpressList.length;i++){
        _promotionExpressList[i].timer.cancel();
      }
    }
  }

  _startTimer(PromotionExpressItemBean promotionExpressItemBean){
    return Timer.periodic(Duration(seconds: 1), (timer){
      promotionExpressItemBean.countdownSeconds -=1;
      promotionExpressItemBean.showTimeName = DateCountDownUtil.constructTime(promotionExpressItemBean.countdownSeconds);
       //DateCountDownUtil转天时分秒的工具类
      if(promotionExpressItemBean.countdownSeconds <=0){
        promotionExpressItemBean.timer.cancel();
        promotionExpressItemBean.showTimeName="已结束";
      }
      setState(() {
      });
    });
  }

  @override
  void dispose() {
    // TODO: implement dispos
    _cancelTimer();
    super.dispose();
  }

2.列表中的倒计时时间跨度是相同的，对于统一时间跨度的列表我们可以使用同一个Timer进行倒计时。

Timer _timer;
_httpExpressList(){
    HttpApplication.getInstance().expressList(callBack: (result){
      Loading.hideLoading(this.context);
      if(result !=null){
        if(mounted){
          var dataList = result['list'] as List;
          var dateNo = DateTime.now();
          List<PromotionExpressItemBean> _dataExpressList = [];
          for(int i = 0; i< dataList.length; i++){
            PromotionExpressItemBean _promotionExpressItemBean = PromotionExpressItemBean.fromJson(dataList[i]);
            if(_promotionExpressItemBean.endTime!=null){
              var diff = DateCountDownUtil.difference(_promotionExpressItemBean.endTime,dateNo);
              _promotionExpressItemBean.countdownSeconds = diff;
              //_promotionExpressItemBean.timer = _startTimer(_promotionExpressItemBean);
            }
            _dataExpressList.add(_promotionExpressItemBean);
          }
          if(_promotionExpressList.length > 0){
            _cancelTimer();
            _promotionExpressList.clear();
          }
          _promotionExpressList = _dataExpressList;
          _startTimer();
          setState(() {});
        }
      }

    },errorCallBack: (error){
      Loading.hideLoading(context);
    });
  }

_startTimer(){
    if(_promotionExpressList.length > 0){
      _timer = Timer.periodic(Duration(seconds: 1), (timer){
        for(int i =0;i<_promotionExpressList.length;i++){
          if(_promotionExpressList[i].endTime != null
              && _promotionExpressList[i].endTime.isNotEmpty){
            var diff = DateCountDownUtil.difference(_promotionExpressList[i].endTime,DateTime.now());
            if(diff>0){
              diff -=1;
            }
            _promotionExpressList[i].showTimeName = diff>0?DateCountDownUtil.constructTime(diff):'已结束';
          }
          setState(() {});
        }
      });
    }
    return _timer;
  }

_cancelTimer(){
    if(_timer!=null && _timer.isActive){
      _timer.cancel();
      _timer = null;
    }
  }
@override
  void dispose() {
    // TODO: implement dispose
    _cancelTimer();
    super.dispose();
  }