I am creating a Chat Polling feature and in chat polling I am showing timer for every new poll. Everything is working fine for the first poll but when I create a 2nd poll form backend new poll is creatine good with new question but the first poll timer is also reflecting in 2nd poll.

This is PollWidget to show Question with Timer.

class PollWidget extends StatefulWidget {

  final Poll poll;
  final disabled;
  final PollCallbacks callbacks;

  PollWidget({required this.poll, required this.callbacks, this.disabled = false});

  @override
  State<StatefulWidget> createState() => PollWidgetState();
}

class PollWidgetState extends State<PollWidget> {

  @override
  Widget build(BuildContext context) {
    return Container(
        child: AbsorbPointer(
          absorbing: widget.disabled,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisAlignment: MainAxisAlignment.center,
            children: _getChildren(widget.poll.question!),
          ),
        ),
    );
  }

  List<Widget> _getChildren(Question question) {
    List<Widget> children = List.empty(growable: true);

      children.add(_getSpace());
      children.add(
        TimerWidget(maxSeconds: widget.poll.maxSeconds, onFinish: () {
          widget.callbacks.onTimeFinished(widget.poll);
          setState(() {
            isPollEnded = true;
          });
          },
        ),
      );
    return children;
  }
}

Here is TimerWidget class to show timere in poll.

class TimerWidget extends StatefulWidget {

  final int maxSeconds;
  final Function onFinish;

  TimerWidget({required this.maxSeconds, required this.onFinish});

  @override
  State<StatefulWidget> createState() => _TimerWidgetState();
}

class _TimerWidgetState extends State<TimerWidget> {
  int currentSeconds = 0;

  Timer? timer;

  @override
  void initState() {
    super.initState();
    currentSeconds = widget.maxSeconds > 0 ? widget.maxSeconds : 0;

    if (currentSeconds > 0) {
      timer = Timer.periodic(Duration(seconds: 1), (timer) {

        setState(() {
          currentSeconds -= 1;
        });
        if (currentSeconds <= 0) {
          timer.cancel();
          widget.onFinish();
        }

      });
    }

  }

  @override
  void dispose() {
    super.dispose();
    timer?.cancel();
    timer = null;
  }

  String getTime() {

    if (currentSeconds >= 86400) {
      int days = currentSeconds~/(24 * 3600);
      int n = currentSeconds % (24 * 3600);
      int hour = n ~/ 3600;
      return "${days.prefixZero()} Days ${hour.prefixZero()} ${Strings.hours}";

    } else if (currentSeconds >= 3600) {
      int hours = currentSeconds~/3600;
      int minutes = (currentSeconds % 3600) ~/ 60;
      int seconds = (currentSeconds% 3600) % 60;
      return "${hours.prefixZero()}:${minutes.prefixZero()}:${seconds.prefixZero()} ${Strings.hours}";

    } else {
      int minutes = currentSeconds ~/60;
      int seconds = currentSeconds % 60;
      return "${minutes.prefixZero()}:${seconds.prefixZero()} ${(currentSeconds >= 60) ? Strings.minutes : Strings.seconds}";
    }
  }

  @override
  Widget build(BuildContext context) =>
      Text("${getTime()}" , style: TextStyle(color: Color(AppColors.alert)),);

}

Please see the output here i have created 2nd poll of 2 min but it is showing above poll time

CodePudding user response：

Can you please try to add Key in Timer Widget?

    class TimerWidget extends StatefulWidget {        
          final int maxSeconds;
          final Function onFinish;
          Key key;    
        
          TimerWidget({required this.maxSeconds, required this.onFinish, Key key});
        
          @override
          State<StatefulWidget> createState() => _TimerWidgetState();
        }

Use Timer Widget Like This

List<Widget> _getChildren(Question question) {
    List<Widget> children = List.empty(growable: true);

      children.add(_getSpace());
      children.add(
        TimerWidget(
      key:UniqueKey(),
       maxSeconds: widget.poll.maxSeconds, onFinish: () {
          widget.callbacks.onTimeFinished(widget.poll);
          setState(() {
            isPollEnded = true;
          });
          },
        ),
      );
    return children;
  }