Improve time counter animation

This commit is contained in:
Neeraj Gupta
2023-03-14 04:52:58 +05:30
parent 0650889afa
commit 2eb7542293

View File

@@ -1,6 +1,5 @@
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:flutter_animation_progress_bar/flutter_animation_progress_bar.dart';
class CodeTimerProgress extends StatefulWidget {
@@ -15,43 +14,43 @@ class CodeTimerProgress extends StatefulWidget {
_CodeTimerProgressState createState() => _CodeTimerProgressState();
}
class _CodeTimerProgressState extends State<CodeTimerProgress> {
Timer? _everySecondTimer;
late int _timeRemaining;
class _CodeTimerProgressState extends State<CodeTimerProgress>
with SingleTickerProviderStateMixin {
late final Ticker _ticker;
double _progress = 0.0;
late final int _microSecondsInPeriod;
@override
void initState() {
super.initState();
_timeRemaining = widget.period;
_updateTimeRemaining();
_everySecondTimer =
Timer.periodic(const Duration(milliseconds: 200), (Timer t) {
_microSecondsInPeriod = widget.period * 1000000;
_ticker = createTicker((elapsed) {
_updateTimeRemaining();
});
_ticker.start();
_updateTimeRemaining();
}
void _updateTimeRemaining() {
int newTimeRemaining =
widget.period - (DateTime.now().second % widget.period);
if (newTimeRemaining != _timeRemaining) {
setState(() {
_timeRemaining = newTimeRemaining;
});
}
int timeRemaining = (_microSecondsInPeriod) -
(DateTime.now().microsecondsSinceEpoch % _microSecondsInPeriod);
setState(() {
_progress = (timeRemaining / _microSecondsInPeriod);
});
}
@override
void dispose() {
_everySecondTimer?.cancel();
_ticker.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return FAProgressBar(
currentValue: _timeRemaining / widget.period * 100,
currentValue: _progress * 100,
size: 4,
animatedDuration: const Duration(milliseconds: 200),
animatedDuration: const Duration(milliseconds: 10),
progressColor: Colors.orange,
changeColorValue: 40,
changeProgressColor: Colors.green,