AnimatedSwitcher 中的两个 Flutter 转换之间需要延迟

Posted 2023-02-23

【中文标题】AnimatedSwitcher 中的两个 Flutter 转换之间需要延迟

【英文标题】：Need delay between two Flutter transitions in AnimatedSwitcher

【发布时间】：2020-11-17 01:48:44

【问题描述】：

我需要在 AnimatedSwitcher transitionBuilder 中的两个转换之间有一个短暂的延迟。我尝试了 Future.delayed，但它没有返回小部件。我应该使用什么？

AnimatedSwitcher(
                          duration: Duration(seconds: 1),
                          transitionBuilder: (
                            Widget child,
                            Animation<double> animation,
                          ) 
                            return SlideTransition(
                              position: Tween<Offset>(
                                      begin: Offset(0.0, 0.1),
                                      end: Offset(0, 0))
                                  .animate(animation),
                              child: FadeTransition(
                                opacity: animation,
                                child: child,
                              ),
                            );
                          ,
                          child: quizStep(quiz, screenWidth),
                        ),

FadeTransition 必须在 SlideTransition 之后几秒钟执行。

【问题讨论】：

你用过Interval class

我尝试使用 Interval 类，但未能在上面的代码中实现.. 能否请您帮忙？

好的，可以分享完整代码吗？

抱歉，Mohammed 仅使用给出的代码解释了 Interval 类。谢谢。

【参考方案1】：

在您使用动画进行淡入淡出和缩放的情况下，动画将同时开始和停止。 但是你可以使用交错动画，你可以在这里找到更多关于它的信息：https://flutter.dev/docs/development/ui/animations/staggered-animations

解决办法是

              FadeTransition(
                opacity: Tween<double>(begin: 0.0, end: 1.0).animate(
                  CurvedAnimation(
                    parent: animation,
                    curve: Interval(0.5, 1.0),
                  ),
                ),
                child: child,
              ),

区间曲线是告诉动画什么时候开始，什么时候结束。 该值应介于 0.0 和 1.0 之间，因为它是动画值，0.5 将在动画时间的一半（半秒）后开始动画，您应该调整它并找到适合您需要的最佳值。

【讨论】：

谢谢...但这会在切换两个小部件之间产生延迟。我需要两个过渡 FadeTransition 和 SlideTransition 之间的延迟..

对不起，我没有先得到你的问题，我会编辑答案