抖动的动画越来越大

Question

我想对图像制作简单的重复动画。它应该保持动画效果，直到用户关闭屏幕。我想要的是图像逐渐变大然后变小。

我已经检查了animationContainer，但这似乎并不是动态地做到这一点。这是我与AnimatedContainer一起使用的代码：

@override
  void didChangeDependencies() {
  increaseSize(widget.seconds);
  super.didChangeDependencies();
}

void increaseSize(int toSize) {
for (i = 0; i > toSize; i++) {
  setState(() {
    _width += i;
    _height += i;
  });
 }
}

@override
  Widget build(BuildContext context) {
    return AnimatedContainer(
  // Use the properties stored in the State class.
  width: _width,
  height: _height,
  decoration: BoxDecoration(
    color: _color,
    borderRadius: _borderRadius,
  ),
   // Define how long the animation should take.
   duration: Duration(seconds: 30),
   // Provide an optional curve to make the animation feel smoother.
   curve: Curves.easeInOutBack,
   );
  ;
}

以前有没有人遇到过，将不胜感激。

非常感谢

Answer 1

尝试这样的事情：

这是一个容器的示例，它在50到100的范围内收缩然后再回到50。

class SizeWidget extends StatefulWidget {
  final int seconds;

  const SizeWidget({this.seconds = 3});

  @override
  _SizeWidgetState createState() => _SizeWidgetState();
}

class _SizeWidgetState extends State<SizeWidget> with TickerProviderStateMixin {
  AnimationController _animationController;
  Animation _sizeAnimation;

  bool reverse = false;

  @override
  void initState() {
    super.initState();

    _animationController = AnimationController(
        vsync: this, duration: Duration(seconds: widget.seconds))
      ..addStatusListener((status) {
        if (status == AnimationStatus.completed) {
          _animationController.repeat(reverse: !reverse);
          reverse = !reverse;
        }
      });

    _sizeAnimation =
        Tween<double>(begin: 50.0, end: 100.0).animate(_animationController);
    _animationController.forward();
  }

  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _sizeAnimation,
      builder: (context, child) => Container(
        width: _sizeAnimation.value,
        height: _sizeAnimation.value,
        color: Colors.red,
      ),
    );
  }
}