Question

在转到下一页之前，我有一个显示SnackBar（或吐司）的按钮。我有一个倒计时，五秒钟后我按了Page2。

RaisedButton(
                    onPressed: () {
                      _startTimer();
                      final snackBar = SnackBar(
                        behavior: SnackBarBehavior.floating,
                        content: Text(
                            'Prepare yourself to start in ${widget._current.toString()}!'), // doesn't work here
                        duration: new Duration(seconds: widget._start),
                        action: SnackBarAction(
                          label: widget._current.toString(), // and neither does here
                          onPressed: () {
                            // Some code to undo the change.
                          },
                        ),
                      );
                      Scaffold.of(context).showSnackBar(snackBar);
                    },
                    child: Text(
                      "I'm ready",
                      style: TextStyle(fontSize: 20),
                    ),
                  ),

倒计时没什么可看的，但我会粘贴一下，以防万一：

void _startTimer() {
    CountdownTimer countDownTimer = new CountdownTimer(
      new Duration(seconds: widget._start),
      new Duration(seconds: 1),
    );

    var sub = countDownTimer.listen(null);
    sub.onData((duration) {
      setState(() {
        widget._current = widget._start - duration.elapsed.inSeconds;
      });
    });

    sub.onDone(() {
      print("Done");
      sub.cancel();
    });
  }

因此，如果我在其他地方（例如，在Text中显示倒数计时，则可以正常工作，但似乎SnackBar并没有改变其包含范围，它总是会获得倒计时的最大次数

Answer 1

这是因为单击该按钮时，小吃店仅创建一次。状态更新时，它将根据更改重建小部件树。小吃店最初不在小部件树中，因此不会更新。

尝试使用堆栈并显示一个小吃店，然后您应该能够根据需要对其进行操作。

希望有帮助。

Answer 2

您需要为小吃店的内容字段实现一个带有倒计时逻辑的自定义小部件，如下所示：

class TextWithCountdown extends StatefulWidget {
  final String text;
  final int countValue;
  final VoidCallback? onCountDown;

  const TextWithCountdown({
    Key? key,
    required this.text,
    required this.countValue,
    this.onCountDown,
  }) : super(key: key);

  @override
  _TextWithCountdownState createState() => _TextWithCountdownState();
}

class _TextWithCountdownState extends State<TextWithCountdown> {
  late int count = widget.countValue;
  late Timer timer;
  @override
  void initState() {
    super.initState();
    timer = Timer.periodic(Duration(seconds: 1), _timerHandle);
  }

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

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text("[$count] " + widget.text),
    );
  }

  void _timerHandle(Timer timer) {
    setState(() {
      count -= 1;
    });
    if (count <= 0) {
      timer.cancel();
      widget.onCountDown?.call();
    }
  }
}

更新Flutter中的SnackBar内容

2 个答案: