向后导航时颤动动画

【问题标题】：Flutter animation on navigating backwards向后导航时颤动动画
【发布时间】：2020-04-15 09:48:00
【问题描述】：

在 Flutter 中导航时，我使用带有漂亮小动画的 PageRouteBuilder。我真的很喜欢Curves.elasticOut，但是当我按下手机上的“返回”按钮时，我希望过渡是“不同的”。目前，它只是使用应用的动画，只是向后播放。向后播放Curves.elasticOut 时似乎不自然，好像屏幕需要跳跃才能跳回上一屏幕。

有没有办法在向后导航时使用Curves.elasticIn？

【问题讨论】：

标签： flutter animation flutter-animation

【解决方案1】：

使用示例：

    transitionDuration: Duration(milliseconds: 5000),
    pageBuilder: (context, animation, secondaryAnimation) => page,
    transitionsBuilder: (context, animation, secondaryAnimation, child) {
      var begin = Offset(1.0, 0.0);
      var end = Offset.zero;
      var curve = Curves.elasticIn;
      var tween = Tween(begin: begin, end: end).chain(CurveTween(curve: curve));
      print("primary: ${animation}");
      return SlideTransition(
        position: animation.drive(tween),
        child: child,
      );
    },
  );

transitionBuilder 中的参数animation 包含属性status，它返回一个AnimationStatus。

一个简单的

var curve = animation.status == AnimationStatus.reverse ? Curves.elasticIn : Curves.elasticOut ;

会的。

【讨论】：