wuweijian1997/FlutterCountdownTimer
A flutter countdown timer. [10 days 5:30:46] ⬇⬇⬇⬇ | flutter倒计时
go to github downloadCountdownTimer
A simple flutter countdown timer widget.Count down through the end timestamp,Trigger an event after the countdown ends.
Installing
Add this to your package’s pubspec.yaml file:
dependencies:
flutter_countdown_timer: ^4.1.0
Install it
$ flutter pub get
CountdownTimer
name | description |
---|---|
endWidget | The widget displayed at the end of the countdown |
widgetBuilder | Widget Function(BuildContext context, CurrentRemainingTime time) |
controller | CountdownTimer start and dispose controller |
endTime | Countdown end time stamp |
onEnd | Countdown end event |
textStyle | Text color |
CountdownTimerController
name | description |
---|---|
endTime | Countdown end time stamp |
onEnd | Countdown end event |
Example
Simple to use
int endTime = DateTime.now().millisecondsSinceEpoch + 1000 * 30;
...
CountdownTimer(
endTime: endTime,
),
Execute event at end.
int endTime = DateTime.now().millisecondsSinceEpoch + 1000 * 30;
void onEnd() {
print('onEnd');
}
...
CountdownTimer(
endTime: endTime,
onEnd: onEnd,
),
Use the controller to end the countdown early.
CountdownTimerController controller;
int endTime = DateTime.now().millisecondsSinceEpoch + 1000 * 30;
@override
void initState() {
super.initState();
controller = CountdownTimerController(endTime: endTime, onEnd: onEnd);
}
void onEnd() {
print('onEnd');
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
CountdownTimer(
controller: controller,
onEnd: onEnd,
endTime: endTime,
),
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.stop),
onPressed: () {
onEnd();
controller.disposeTimer();
},
),
);
}
@override
void dispose() {
controller.dispose();
super.dispose();
}
Custom style.
int endTime = DateTime.now().millisecondsSinceEpoch + 1000 * 30;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
CountdownTimer(
endTime: endTime,
widgetBuilder: (_, CurrentRemainingTime time) {
if (time == null) {
return Text('Game over');
}
return Text(
'days: [ ${time.days} ], hours: [ ${time.hours} ], min: [ ${time.min} ], sec: [ ${time.sec} ]');
},
),
),
);
}
Using millisecond animation
class _CountdownTimerPageState extends State<CountdownTimerPage>
with SingleTickerProviderStateMixin {
late CountdownTimerController controller;
int endTime = DateTime.now().millisecondsSinceEpoch +
Duration(seconds: 30).inMilliseconds;
@override
void initState() {
super.initState();
controller =
CountdownTimerController(endTime: endTime, onEnd: onEnd, vsync: this);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
CountdownTimer(
controller: controller,
widgetBuilder: (BuildContext context, CurrentRemainingTime? time) {
if (time == null) {
return Text('Game over');
}
List<Widget> list = [];
if (time.sec != null) {
list.add(Row(
children: <Widget>[
Icon(Icons.sentiment_very_satisfied),
Text(time.sec.toString()),
],
));
}
if (time.milliseconds != null) {
list.add(Row(
children: <Widget>[
Icon(Icons.sentiment_very_satisfied),
AnimatedBuilder(
animation: time.milliseconds!,
builder: (context, child) {
return Text("${(time.milliseconds!.value * 1000).toInt()}");
},
)
],
));
}
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: list,
);
},
),
],
),
);
}
}
In ListView.builder
class ListViewPage extends StatefulWidget {
static final String rName = "ListView";
@override
_ListViewPageState createState() => _ListViewPageState();
}
class _ListViewPageState extends State<ListViewPage> {
int endTime = DateTime.now().millisecondsSinceEpoch + 1000 * 60 * 60;
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView.builder(
itemCount: 200,
itemBuilder: (context, index) {
if (index == 0) {
return _CountdownDemo(endTime);
} else {
return Container(
height: 200,
color: Colors.blue,
margin: EdgeInsets.all(10),
);
}
},
),
);
}
}
class _CountdownDemo extends StatefulWidget {
final int endTime;
_CountdownDemo(this.endTime);
@override
__CountdownDemoState createState() => __CountdownDemoState();
}
class __CountdownDemoState extends State<_CountdownDemo> {
CountdownTimerController countdownTimerController;
@override
Widget build(BuildContext context) {
return CountdownTimer(
controller: countdownTimerController,
);
}
@override
void initState() {
super.initState();
countdownTimerController =
CountdownTimerController(endTime: widget.endTime);
}
}
Countdown
CountdownController countdownController = CountdownController(duration: Duration(minutes: 1));
Scaffold(
body: Center(
child: Countdown(countdownController: countdownController),
),
floatingActionButton: FloatingActionButton(
child: Icon(countdownController.isRunning ? Icons.stop : Icons.play_arrow),
onPressed: () {
if(!countdownController.isRunning) {
///start
countdownController.start();
} else {
///pause
countdownController.stop();
}
setState(() {
///change icon
});
},
),
)
![](/images/banner-woo.jpg)
excellent projects related to wuweijian1997/FlutterCountdownTimer recommend downloading
AppFlowy
47859
AppFlowy is an open-source alternative to Notion. You are in charge of your data and customizations. Built with Flutter and Rust.
localsend
33797
An open-source cross-platform alternative to AirDrop
spotube
23772
🎧 Open source Spotify client that doesn't require Premium nor uses Electron! Available for both desktop & mobile!
revanced-manager
15035
💊 Application to use ReVanced on Android
gsy_github_app_flutter
14559
Flutter 超完整的开源项目,功能丰富,适合学习和日常使用。GSYGithubApp系列的优势:我们目前已经拥有Flutter、Weex、ReactNative、kotlin 四个版本。 功能齐全,项目框架内技术涉及面广,完成度高,持续维护,配套文章,适合全面学习,对比参考。跨平台的开源Github客户端App,更好的体验,更丰富的功能,旨在更好的日常管理和维护个人Github,提供更好更方便的驾车体验Σ( ̄。 ̄ノ)ノ。同款Weex版本 : https://github.com/CarGuo/GSYGithubAppWeex 、同款React Native版本 : https://github.com/CarGuo/GSYGithubApp 、原生 kotlin 版本 https://github.com/CarGuo/GSYGithubAppKotlin
dio
12249
A powerful HTTP client for Dart and Flutter, which supports global settings, Interceptors, FormData, aborting and canceling a request, files uploading and downloading, requests timeout, custom adapters, etc.
gopeed
11832
A modern download manager that supports all platforms. Built with Golang and Flutter.
bloc
11441
A predictable state management library that helps implement the BLoC design pattern
getx
9899
Open screens/snackbars/dialogs/bottomSheets without context, manage states and inject dependencies easily with Get.
flame
8846
A Flutter based game engine.
flutter_deer
7595
🦌 Flutter 练习项目(包括集成测试、可访问性测试)。内含完整UI设计图,更贴近真实项目的练习。Flutter practice project (including integration testing and accessibility testing). Contains complete UI design drawings for a more realistic practice project.
fish-redux
7343
An assembled flutter application framework.
hiddify-next
7232
Multi-platform auto-proxy client, supporting Sing-box, X-ray, TUIC, Hysteria, Reality, Trojan, SSH etc. It’s an open-source, secure and ad-free.
ente
6686
Fully open source, End to End Encrypted alternative to Google Photos and Apple Photos
fl_chart
6451
FL Chart is a highly customizable Flutter chart library that supports Line Chart, Bar Chart, Pie Chart, Scatter Chart, and Radar Chart.
pixez-flutter
6360
一个支持免代理直连及查看动图的第三方Pixiv flutter客户端
Flutter-Responsive-Admin-Panel-or-Dashboard
6355
Responsive Admin Panel or Dashboard using Flutter
aidea
6021
AIdea 是一款支持 GPT 以及国产大语言模型通义千问、文心一言等,支持 Stable Diffusion 文生图、图生图、 SDXL1.0、超分辨率、图片上色的全能型 APP。
riverpod
5828
A reactive caching and data-binding framework. Riverpod makes working with asynchronous code a breeze.
pikapika
5463
美观易用且无广告的漫画和游戏客户端,同时支持MacOS,Windows,Android,iOS。