使用 Flutter 制作序列动画

Question

我正在尝试使用 Flutter 创建两个连续的动画。两者都使用 Curves.easeIn，第二个从第一个开始，而不是从 0 开始。想象一辆汽车开始从 0 到 50 英里/小时移动，运行一段时间后，它加速到 70 英里/小时从 50 英里/小时而不是 0 英里/小时。我该怎么做？ 我知道并使用 TweenSequence，但我无法找到使其工作的方法。 谢谢。

Answer 1

了解您到底试图确保我们不会在这里盲目飞行并错过您的观点可能会有所帮助，但我可以向您指出文档此处并提供：

final Animation<double> animation = TweenSequence<double>(
  <TweenSequenceItem<double>>[
    TweenSequenceItem<double>(
      tween: Tween<double>(begin: 0.0, end: 50.0)
        .chain(CurveTween(curve: Curves.ease)),
      weight: 40.0,
    ),
    // This may be optional for you: this should keep the animation at a given point.
    TweenSequenceItem<double>(
      tween: ConstantTween<double>(50.0),
      weight: 20.0,
    ),
    TweenSequenceItem<double>(
      tween: Tween<double>(begin: 50.0, end: 70.0)
        .chain(CurveTween(curve: Curves.easeIn)),
      weight: 40.0,
    ),
  ],
).animate(myAnimationController);

如果您可以添加给您带来麻烦的代码，我很乐意进行更深入的研究，如果需要，我可以修改我的答案以使其更加定制。祝你好运。