flutter - Fluter 循环倒数计时器
问题描述
我正在尝试创建一个计时器应用程序,该应用程序具有多个用于不同任务的倒数计时器。我面临的问题是,如果我启动一个计时器,然后按返回按钮,计时器就会停止。所以我希望,该计时器一直运行到它被暂停或计时器结束并提醒用户或应用程序被破坏。帮助我如何使用 Flutter 做到这一点?任何示例代码都会受到赞赏?请帮帮我。我被这个问题困扰了一个月。不知道如何摆脱它的家伙。
import 'dart:async';
import 'dart:convert';
import 'package:awesome_notifications/awesome_notifications.dart';
import 'package:circular_countdown_timer/circular_countdown_timer.dart';
import 'package:flash_chat/components/button.dart';
import 'package:flash_chat/screens/promotersDetails.dart';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
class ViewPromoters extends StatefulWidget {
final String a_id, s_id;
ViewPromoters({Key key, @required this.a_id, @required this.s_id})
: super(key: key);
@override
_ViewPromotersState createState() => _ViewPromotersState(a_id, s_id);
}
class _ViewPromotersState extends State<ViewPromoters> {
CountDownController _controller = CountDownController();
var descList = [
"Engagement Selfie = 5",
"Engagement Selfie = 7",
"Engagement Selfie = 9",
"Engagement Selfie = 7",
"Engagement Selfie = 3",
];
var selfieList = [
"Sampling Selfie = 5",
"Sampling Selfie = 7",
"Sampling Selfie = 9",
"Sampling Selfie = 7",
"Sampling Selfie = 3",
];
var dataList = [
"Data Collection = 5",
"Data Collection = 7",
"Data Collection = 9",
"Data Collection = 7",
"Data Collection = 3",
];
var timeList = [
"Last Selfie Time = 04:25 PM",
"Last Selfie Time = 04:20 PM",
"Last Selfie Time = 05:10 PM",
"Last Selfie Time = 03:20 PM",
"Last Selfie Time = 04:00 PM",
];
// Image Name List Here
var imgList = [
"images/img1.jpg",
"images/img2.jpg",
"images/img3.jpg",
"images/img4.jpg",
"images/img5.jpg",
];
String p_id, p_name;
Map mapResponse;
List listResponse;
String a_id, s_id;
_ViewPromotersState(this.a_id, this.s_id);
Future fetchdata() async {
print(s_id); // Supervisor Id
var url = await http.get(Uri.parse(
"http://demo.likemyfiles.com/DS/api/api_supervisor/supervisor/$s_id"));
setState(() {
mapResponse = json.decode(url.body);
print(mapResponse);
listResponse = mapResponse['promoters'];
print(listResponse);
});
}
@override
void initState() {
fetchdata();
super.initState();
}
@override
Widget build(BuildContext context) {
double width = MediaQuery.of(context).size.width * 0.6;
return Scaffold(
appBar: AppBar(
// App Bar
title: Text(
"Promoters Detail",
style: TextStyle(color: Colors.white),
),
actions: <Widget>[
IconButton(
icon: Icon(
Icons.notifications_active,
color: Colors.white,
),
onPressed: () {
Notify();
},
)
],
elevation: 5,
backgroundColor: Colors.green,
),
// Main List View With Builder
body: ListView.builder(
itemCount: 3,
itemBuilder: (context, index) {
return GestureDetector(
onTap: () {
p_id = listResponse[index]['id'].toString();
print(p_id);
p_name = listResponse[index]['name'].toString();
showDialogFunc(context, imgList[index], p_name, descList[index],
timeList[index], p_id, a_id);
},
// Card Which Holds Layout Of ListView Item
child: Card(
color: Colors.white,
elevation: 5,
child: Column(
children: [
**CircularCountDownTimer(
width: MediaQuery.of(context).size.width / 6,
height: MediaQuery.of(context).size.width / 6,
duration: 120,
fillColor: Colors.green,
ringColor: Colors.white,
controller: _controller,
backgroundColor: Colors.white54,
strokeWidth: 10.0,
strokeCap: StrokeCap.round,
isTimerTextShown: true,
isReverse: false,
onComplete: () {
Notify();
},
textStyle: TextStyle(fontSize: 20.0, color: Colors.black),
),**
Row(
children: <Widget>[
CircleAvatar(
radius: 60,
backgroundImage: AssetImage(imgList[index]),
),
Padding(
padding: const EdgeInsets.all(10.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
child: listResponse == null
? Container()
: Text(
listResponse[index]['name'].toString(),
style: TextStyle(
color: Colors.grey.shade500,
fontSize: 20.0,
fontWeight: FontWeight.w400,
),
),
),
SizedBox(
height: 10,
),
Container(
width: width,
child: Row(
children: [
Icon(
Icons.add_task_sharp,
color: Colors.grey[500],
size: 20.0,
),
SizedBox(
width: 7,
),
Text(
descList[index],
maxLines: 3,
style: TextStyle(
fontSize: 15,
color: Colors.grey[500],
fontWeight: FontWeight.w500),
),
],
),
),
Container(
width: width,
child: Row(
children: [
Icon(
Icons.add_photo_alternate_outlined,
color: Colors.grey[500],
size: 20.0,
),
SizedBox(
width: 7,
),
Text(
selfieList[index],
maxLines: 3,
style: TextStyle(
fontSize: 15,
color: Colors.grey[500],
fontWeight: FontWeight.w500),
),
],
),
),
Container(
width: width,
child: Row(
children: [
Icon(
Icons.dashboard_customize,
color: Colors.grey[500],
size: 20.0,
),
SizedBox(
width: 7,
),
Text(
dataList[index],
maxLines: 3,
style: TextStyle(
fontSize: 15,
color: Colors.grey[500],
fontWeight: FontWeight.w500),
),
],
),
),
Container(
width: width,
child: Row(
children: [
Icon(
Icons.assignment_ind_sharp,
color: Colors.grey[500],
size: 20.0,
),
SizedBox(
width: 7,
),
Text(
timeList[index],
maxLines: 3,
style: TextStyle(
fontSize: 15,
color: Colors.grey[500],
fontWeight: FontWeight.w500),
),
],
),
),
],
),
)
],
),
],
),
),
);
},
),
);
}
}
// This is a block of Model Dialog
showDialogFunc(context, img, title, desc, time, promoter_id, activity_id) {
return showDialog(
context: context,
builder: (context) {
return Center(
child: Material(
type: MaterialType.transparency,
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.white,
),
padding: EdgeInsets.all(15),
height: 400,
width: MediaQuery.of(context).size.width * 0.7,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
ClipRRect(
borderRadius: BorderRadius.circular(5),
child: Image.asset(
img,
width: 140,
height: 140,
),
),
SizedBox(
height: 10,
),
Text(
title,
style: TextStyle(
fontSize: 20,
color: Colors.grey,
fontWeight: FontWeight.bold,
),
),
SizedBox(
height: 2,
),
Container(
// width: 200,
child: Align(
alignment: Alignment.center,
child: Text(
time,
maxLines: 3,
style: TextStyle(fontSize: 15, color: Colors.grey[500]),
textAlign: TextAlign.center,
),
),
),
Button(
title: 'Attendance Photos',
colour: Colors.green,
onPressed: () {
print(activity_id);
print(promoter_id);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => PromotersDetails(
url:
URL,
title: "Attendance Selfie",
)),
);
}),
Button(
title: 'Engagement Photos',
colour: Colors.green,
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => PromotersDetails(
url:
URL,
title: "Engagement Selfie",
)),
);
}),
Button(
title: ' Sampling Photos ',
colour: Colors.green,
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => PromotersDetails(
url:
URL,
title: "Sampling Photos",
)),
);
}),
],
),
),
),
);
},
);
}
void Notify() async {
await AwesomeNotifications().createNotification(
content: NotificationContent(
id: 1,
channelKey: 'key1',
title: 'This is Notification',
body: 'T His is body of Notify'));
}
解决方案
待定。我知道这是一种不好的方法,设备上的性能可能会受到影响。但是您可以在应用程序的状态下定义一个控制器。然后将该控制器传递到您的计时器中。这是一个非常糟糕的方法,您需要处理何时处理它。但如果没有任何工作,它是一种解决方法。
推荐阅读
- php - PHP检测挂机?
- pandas - Pandas DataFrame 自定义 agg 函数的奇怪行为
- php - PHP 从邮件中保存图像 > 虚假 DQT 索引 12 错误
- reactjs - 我已经尝试安装 expo-cli 好几天了,但仍然无法弄清楚出了什么问题
- python - 期望值:第 1 行第 1 列 (char 0) (django)
- arrays - 如何修复 Leetcode 54. 螺旋矩阵代码中的错误?
- css - 如何在数据切换折叠时添加向上和向下箭头?
- javascript - Vue.js 中的方法无法更改数据值
- html - 为 HTML 表单创建本地存储
- jestjs - 尝试使用模拟/间谍时出现矛盾的错误