Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

假设要实现一个这样的动画:
image

看网上的很多教程都是不同属性动画值的例子,要是这种一个值在一个动画中发生了一种以上变化的情况应该怎么写?

opacity = Tween(begin: 0.0, end: 1.0)
  .animate(CurvedAnimation(
    parent: aniamtionController,
    curve: Interval(0.0, 1.0, curve: Curves.ease)
  ));
  
width = Tween(begin: 100, end: 130)
  .animate(CurvedAnimation(
    parent: aniamtionController,
    curve: Interval(0.0, 0.5, curve: Curves.ease)
  ));

// 缺少了width的后半段动画

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
1.6k views
Welcome To Ask or Share your Answers For Others

1 Answer

找到了,使用TweenSequence部件,可以创建顺序动画。

width = TweenSequence([
  TweenSequenceItem(tween: Tween(begin: 100, end: 130), weight: 1),
  TweenSequenceItem(tween: Tween(begin: 130, end: 100), weight: 1),
]).animate(animationController);

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...