颤振:从当前物体位置重新启动SlideAnimation

问题描述:

我有一个SlideAnimation上的对象,每当我点击屏幕时触发一个对象。物体只是向上滑动,但当我再次点击屏幕时,动画将再次从对象的原始位置开始。我将如何捕获对象在最后一个动画中结束的位置并从那里执行动画?
我已经得到了SlideTransition的创建下面的代码:颤振:从当前物体位置重新启动SlideAnimation

 new SlideTransition(
      child: new Container(
      child: char, 
     ), 
      position: _characterPosition, 
     ) 

而且此代码为实际动画:

_characterPosition = new FractionalOffsetTween(
    begin: const FractionalOffset(0.0, 0.0), 
    end: const FractionalOffset(0.0, -0.2), 
).animate(new CurvedAnimation(
    parent: _characterAnimationController, 
    curve: Curves.easeOut, 
) 
); 

在最简单的情况下,你可以使用你的_characterAnimationControllerAnimationController有两种相关的方法stopforward。验证当前动画的状态,并调用所需的方法:

void _onTap() { 
    if (_characterAnimationController.isAnimating) { 
     _characterAnimationController.stop(canceled: false); 
    } else { 
     _characterAnimationController.forward(); 
    } 
} 

要在完成后,延长的动画,您可以通过重置value状态_characterAnimationController(或创建新的)和更新位置。完整示例:

class Home extends StatefulWidget { 
    @override 
    State createState() => new _HomeState(); 
} 

class _HomeState extends State<Home> with TickerProviderStateMixin { 
    Animation _characterPosition; 
    AnimationController _characterAnimationController; 
    FractionalOffset _beginOffset; 
    FractionalOffset _endOffset; 
    FractionalOffset _animationOffset; 

    void _restartAnimation() { 
    _characterAnimationController.value = 0.0; 
    _beginOffset = _endOffset; 
    _endOffset = _endOffset + _animationOffset; 

    setState(() { 
     _characterPosition = _generateCharacterPosition(); 
    }); 

    _characterAnimationController.forward(); 
    } 

    @override 
    void initState() { 
    _animationOffset = const FractionalOffset(0.0, 0.15); 
    _beginOffset = const FractionalOffset(0.0, 0.0); 
    _endOffset = _animationOffset; 

    _characterAnimationController = new AnimationController(
     duration: new Duration(seconds: 5), vsync: this); 
    _characterPosition = _generateCharacterPosition(); 
    } 

    @override 
    Widget build(BuildContext context) { 
    return new Material(
     child: new InkWell(
     child: new SlideTransition(
      child: new Container(
      child: new Text("Hello"), 
     ), 
      position: _characterPosition, 
     ), 
     onTap: _onTap, 
    ), 
    ); 
    } 

    void _onTap() { 
    if (_characterAnimationController.isAnimating) { 
     _characterAnimationController.stop(canceled: false); 
    } else if (_characterAnimationController.status == 
     AnimationStatus.completed) { 
     _restartAnimation(); 
    } else { 
     _characterAnimationController.forward(); 
    } 
    } 

    Animation _generateCharacterPosition() => new FractionalOffsetTween(
     begin: _beginOffset, 
     end: _endOffset, 
    ) 
      .animate(new CurvedAnimation(
     parent: _characterAnimationController, 
     curve: Curves.easeOut, 
    )); 
} 
+0

这适用于动画未完成时的情况。但一旦完成并且您再次点击屏幕,动画将再次从原始位置开始。任何其他想法? –

+0

动画完成后您想要什么行为,然后再次点击?你能举一些例子吗? – Mogol

+0

当然,可能我不好解释它不够好,但: 我想能够开始一个动画,一旦它停止(或者因为它停止或它完成)我想再次抵消对象动画,但从它刚刚动画到的新位置。 –