0

Sou nova em flutter e estou a criar um aplicativo de fitness para um projeto da escola. No entanto, tenho um problema com o meu CircularCountDownTimer, porque quando carrego no botão para mudar o exercício o tempo permanece o mesmo o que não era suposto.

O que está a acontecer é o seguinte: inserir a descrição da imagem aqui

O meu código é o seguinte:

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

class Screen extends StatefulWidget {
  @override
  _ScreenState createState() => _ScreenState();
}

class ScreenData {
  final String title;
  final String subtitle;
  final String image;
  final int duration;

  const ScreenData(this.title, this.subtitle, this.image, this.duration);
}

class _ScreenState extends State<Screen> {
  bool startStop = true;

  static const List<ScreenData> _data = [
    ScreenData("Saltar à corda", "Próximo: Subir à cadeira",
        "assets/images/1.gif", 15),
    ScreenData("Subir à cadeira", "Próximo: Flexões",
        "assets/images/2.gif", 10),
    ScreenData(
        "Flexões", "Próximo: Abdominais", "assets/images/1.gif", 10),
    ScreenData("Abdominais", "Próximo: Prancha", "assets/images/2.gif", 10),
    ScreenData("Prancha", "", "assets/images/1.gif", 25),
  ];
  int _currentIndex = 0;
  ScreenData get _currentData => _data[_currentIndex];

  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    CountDownController _controller = CountDownController();
    return Column(children: [
    Stack(...),
    Container(
    padding: EdgeInsets.fromLTRB(20.0, 30.0, 20.0, 20.0),
    height: size.height - 270.0,
    width: size.width,
    color: Colors.white,
    child: Column(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        Column(...),
            Padding(
            padding: const EdgeInsets.only(top: 0),
            child: CircularCountDownTimer(
              duration: _currentData.duration,
              controller: _controller,
              width: MediaQuery.of(context).size.width / 5,
              height: MediaQuery.of(context).size.height / 5,
              color: Colors.white,
              fillColor: Colors.red,
              backgroundColor: null,
              strokeWidth: 5.0,
              strokeCap: StrokeCap.butt,
              textStyle: TextStyle(
                  decoration: TextDecoration.none,
                  fontSize: 22.0,
                  color: Colors.black,
                  fontWeight: FontWeight.bold),
              isReverse: true,
              isReverseAnimation: true,
              isTimerTextShown: true,
            )),
            Row(...),
          ],
        ),
      ),
       ]);
     }
   }

Alguém me pode ajudar?

1 Resposta 1

1

Você não precisa (e acho que não deve) criar o controller na função build, já que ela será chamada várias vezes.

Eu não sei o que você está fazendo no evento do botão "Próximo", mas aqui está o meu:

ElevatedButton(
  onPressed: () {
    setState(() {
      if (++_currentIndex >= _data.length) {
        _currentIndex = 0;
      }
    });

    // Passei a duração como parâmetro.
    _controller.restart(duration: _data[_currentIndex].duration);
  },
  child: Text('Próximo')
)

O resultado:

inserir a descrição da imagem aqui

Edit: O source completo você pode ver aqui -> https://gist.github.com/MestreKarin/f57926b072c7f2d6abc0fec52977711c

PS. Estou usando o null-safety.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .