сделать обратный отсчет таймера во флаттере - PullRequest
1 голос
/ 05 февраля 2020

Я хочу использовать приведенный ниже пример кода для раздела Еженедельное предложение, но для этого мне нужны две вещи:

1 - добавить счетчик дней в моем таймере 2 - я хочу запустить таймер в обратном порядке, например, я хочу использовать его в течение недели, что означает 7 дней обратного отсчета, и когда он будет завершен, автоматически начнется через 7 дней снова ... как я могу сделать это с этим кодом. Спасибо.

import 'package:flutter/material.dart';
import 'dart:async';

 class TimerWeek extends StatefulWidget {
 @override
 _TimerWeekState createState() => _TimerWeekState();
 }

class _TimerWeekState extends State<TimerWeek> {
 static const duration = const Duration(seconds: 1);

 int secondPassed = 0;
 bool isActive = false;

 Timer timer;
 void handleTick() {
  if (isActive) {
   setState(() {
     secondPassed = secondPassed + 1;
   });
   }
  }

@override
Widget build(BuildContext context) {
if (timer == null) {
  timer = Timer.periodic(duration, (Timer t) {
    handleTick();
  });
}
int seconds = secondPassed % 60;
int minutes = secondPassed ~/ 60;
int hours = secondPassed ~/ (60 * 60);
return Container(
  child: Column(
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          LabelText(label: '', value: hours.toString().padLeft(2, '0')),
          LabelText(label: '', value: minutes.toString().padLeft(2, '0')),
          LabelText(label: '', value: seconds.toString().padLeft(2, '0')),
        ],
      ),
      SizedBox(height: 30),
      Container(
        width: 200,
        height: 47,
        margin: EdgeInsets.only(top: 30),
        child: RaisedButton(
          color: Colors.pink[200],
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(25)),
          child: Text(isActive ? 'STOP' : 'START'),
          onPressed: () {
            setState(() {
              isActive = !isActive;
            });
          },
        ),
      )
    ],
  ),
);
}
}
class LabelText extends StatelessWidget {
 LabelText({this.label, this.value});

 final String label;
 final String value;

 @override
 Widget build(BuildContext context) {
  return Container(
   margin: EdgeInsets.symmetric(horizontal: 5),
   padding: EdgeInsets.all(20),
    decoration: BoxDecoration(
     borderRadius: BorderRadius.circular(25),
     color: Colors.teal,
   ),
   child: Column(
     mainAxisSize: MainAxisSize.min,
     children: <Widget>[
       Text(
         '$value',
         style: TextStyle(
             color: Colors.white, fontSize: 12, fontWeight: FontWeight.bold),
       ),
      Text(
        '$label',
        style: TextStyle(
          color: Colors.white70,
        ),
      ),
    ],
  ),
);
}
}

1 Ответ

1 голос
/ 05 февраля 2020

Ну, поправьте меня, если я ошибаюсь, но вы ищете таймер обратного отсчета на 1 неделю? Похоже, у вас уже есть часы, минуты и секунды в вашем таймере на этом этапе, поэтому вы просто добавили бы дни, неделю и отсчитали оттуда timeLeft.

int days = secondPassed ~/ (86400); 
int const week = 604800;  // number of seconds in a week
int timeLeft = week - secondPassed;
int daysLeft = timeLeft ~/ (86400);
int hoursLeft = (timeLeft - (daysLeft * 86400)) ~/ (3600); //number of seconds in an hour
int minutesLeft = (timeLeft - (daysLeft * 86400) - (hoursLeft * 3600)) ~/ (60);
int secondsLeft = (timeLeft - (daysLeft * 86400) - (hoursLeft * 3600) - (minutesLeft * 60)) % (60);

Таким образом, вы бы секунд, минут, часов и дней, оставшихся на неделе, а затем просто добавьте блок операторов IF для проверки, если timeLeft = 0, а затем снова установите таймер на 604800.

Если я неправильно понимаю, что вы Не стесняйтесь, дайте мне знать, и я постараюсь ответить на это!

...