flutter - 旋转动画在开始时旋转两次

Question

我刚刚注意到，旋转动画在热重启后旋转两倍。此后，它运行良好，但仅仅是因为第一次出现故障，按钮才是上下颠倒的。我有此按钮，每按一次该按钮应旋转180度。

  AnimationController _animationController;
  bool pressed = false;
  Animation<double> _animation;

 @override
  void initState() {
    _animationController =
        AnimationController(duration: Duration(milliseconds: 200), vsync: this);

    super.initState();
  }


_animation =
    Tween<double>(begin: !pressed ? 0 : 0.5, end: !pressed ? 0.5 : 1)
        .animate(_animationController);

  SizedBox.fromSize(
        size: Size(50, 50),
        child: ClipOval(
          child: Material(
            color: Colors.blue,
            child: InkWell(
              onTap: () {
                _animationController.forward(from: 0);
                setState(() {
                  pressed = !pressed;
                });
              },
              splashColor: Colors.black12,
              child: RotationTransition(
                turns: _animation,
                child: Icon(
                  Icons.filter_list,
                  color: Colors.white,
                ),
              ),
            ),
          ),
        ),
      )

Answer 1

请引用choosing an approach in Animation introduction
在您的情况下，我希望TweenAnimationBuilder

  /// content of State of statefull widget
  bool pressed = false;
  Tween<double> _tween = Tween<double>(begin: null, end: 0.0);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: TweenAnimationBuilder(
          duration: Duration(seconds: 1),
          tween: _tween,
          builder: (context, turns, child) {
            return GestureDetector(
              onTap: () {
                _tween = Tween<double>(end: pressed ? 0 : 0.5);
                pressed = !pressed;
                setState(() {});
              },
              child: Transform.rotate(
                angle: turns * pi * 2, /// need to import 'dart:math';
                child: Text('$pressed'),
              ),
            );
          },
        ),
      ),
    );
  }

附言关于您的方法中的问题的一句话。
您同时依赖重建和animationController，但它们彼此独立

init，按下== false，补间0-> 0.5

当点击的动画从0-> 0.5 开始动画时，

setState press = true，并使用新的补间0.5重建窗口小部件-> 1，animationController仍未完成，并且这次将动画设置为新值0.5-> 1-您可以看到此步骤