Flutter使弹出动画的持续时间与推送相同

Question

我正在使用 Hero 和 PageRouteBuilder 在两个屏幕之间导航动画。问题是我的 pop 动画比我的 push 短得多，看起来有点笨拙。为了更好地理解，这里有一个ScreenVideo。

这就是我构建 push 的方式：

static PageRouteBuilder _buildTransitionToMonthPage(Month month) {
    return PageRouteBuilder(
      transitionDuration: Duration(milliseconds: 1000),
      pageBuilder: (BuildContext context, Animation<double> animation,
          Animation<double> secondaryAnimation) {
        return MonthPage(
          month: month,
        );
      },
      transitionsBuilder: (BuildContext context, Animation<double> animation,
          Animation<double> secondaryAnimation, Widget child) {
        return FadeTransition(opacity: animation, child: child);
      },
    );
  }
}

在另一个屏幕上，我只是调用 Navigator.pop(context)。我在这里错过了什么？它不应该简单地反转动画持续时间吗？

Answer 1

基于 documentation 对于 PageRouteBuilder，对于属性 transitionDuration 它说：“过渡的持续时间 forwards." 最初，它被设置为 300ms 持续时间（查看源代码）。

this.transitionDuration = const Duration(milliseconds: 300)

此外还有一个 reverseTransitionDuration 属性声明：“过渡反向的持续时间。” 最初它的值与 transitionDuration

相同

this.reverseTransitionDuration = const Duration(milliseconds: 300),

您为什么遇到这个问题？

您提供的正向转换为 1000 毫秒，而反向转换仍为 300 毫秒。因此，添加 reverseTransitionDuration: const Duration(1000) 将解决您的问题。

Flutter使弹出动画的持续时间与推送相同

Flutter make pop animation with same duration as push

flutter

dart

routes

push

transition