Flutter 倒计时实现
1.此组建用时间戳计算倒计时
import 'dart:async';
import 'package:flutter/material.dart';
import 'dart:ui';
class itemOrderWidget extends StatefulWidget {
final int order;
final String type;
final childrenCallBack;
itemOrderWidget({
Key key,
this.order,
this.type,
this.childrenCallBack,
}) : super(key: key);
@override
_itemOrderWidgetState createState() => _itemOrderWidgetState(timerControl: order);
}
class _itemOrderWidgetState extends State<itemOrderWidget> {
_itemOrderWidgetState({this.timerControl});
int timerControl;
String remainTime = '--:--';// 显示相应的剩余时间
Timer _timer;
@override
void initState() {
super.initState();
// 初始化的时候开启倒计时
start(timerControl);
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Text(
remainTime,
style: TextStyle(
fontSize: 22.0, color: Color(0xffAA1F52), fontFamily: 'Akrobat-Bold'),
);
}
void caculateTime(nowTime, endTime) {
var _surplus = endTime.difference(nowTime);
int day = (_surplus.inSeconds ~/ 3600) ~/ 24;
int hour = (_surplus.inSeconds ~/ 3600) % 24;
int minute = _surplus.inSeconds % 3600 ~/ 60;
// 如果用到秒的话计算
int second = _surplus.inSeconds % 60;
String minStat = "0"; //统计总分钟
String secondString = "0"; //秒
String str = ""; //统计
minStat = (day*24*60 + hour*60 + minute).toString(); //换算成分
if(int.parse(minStat) < 10){
minStat = "0" + minStat.toString();
}
secondString = second < 10 ? "0" + second.toString() :second.toString();
str =minStat+":"+secondString;
setState(() {
remainTime = str;
});
}
void startCountDown(time){
var nowTime = DateTime.now();
var endTime = DateTime.parse(time.toString());
// 重新计时的时候要把之前的清除掉
if (_timer != null) {
if (_timer.isActive) {
_timer.cancel();
_timer = null;
}
}
const repeatPeriod = const Duration(seconds: 1);
caculateTime(nowTime, endTime);
_timer = new Timer.periodic(repeatPeriod, (timer) {
//到时回调
nowTime = nowTime.add(repeatPeriod);
if (endTime.millisecondsSinceEpoch - nowTime.millisecondsSinceEpoch < 0) {
//取消定时器,避免无限回调
timer.cancel();
timer = null;
setState(() {
remainTime = '00:00'; //最小限制在00:00
});
// print("无限回调???????");
widget.childrenCallBack(widget.type); //回调值
return null;
}
caculateTime(nowTime, endTime);
});
}
void start(timerControl){
DateTime expiredTimeFormat = DateTime.fromMillisecondsSinceEpoch(timerControl);
if(timerControl - DateTime.now().millisecondsSinceEpoch > 0){
startCountDown(expiredTimeFormat);
}else{ // 此处为防止进来时就为00:00导致计时器跳动
setState(() {
remainTime = '00:00';
});
}
}
@override
void dispose() {
super.dispose();
// 在页面回收或滑动复用回收的时候一定要把 timer 清除
if (_timer != null) {
if (_timer.isActive) {
_timer.cancel();
_timer = null;
}
}
}
@override
void didUpdateWidget(itemOrderWidget oldWidget) {
super.didUpdateWidget(oldWidget);
//传入的新值不等于旧值时赋值,避免使用多个倒计时组建时造成的值为上次传入的值
if(oldWidget.order != widget.order){
timerControl = widget.order;
}
// 外部重新请求接口后重新进行倒计时,这个方法是用来监控外部 setState 的
start(timerControl);
}
}
2.调用
new itemOrderWidget(order:item['statusExpiredUnixTime'],type:'WAITING',childrenCallBack:(value) =>widget.childrenCallBack(value)),