如何在 Flutter 中真正使用 SizeTransition？

Question

我想做出与此相同的效果： https : //api.flutter.dev/flutter/widgets/SizeTransition-class.html但从图像的开头开始。 我尝试了一切，但这不起作用！

我试图将 Align 放入其中，放入一个宽度由动画值修改的容器..没有任何效果！

我之前有一个动画，然后它会在完成时调用 forward() （有一个称为 complete 的函数调用 forward() 函数）。

initState() {
   _sizeController =
        AnimationController(duration: Duration(seconds: 1), vsync: this)
          ..addListener(() {
            setState(() {});
          });

    _sizeAnimation = Tween(begin: 0.0, end: 27.0).animate(CurvedAnimation(
        parent: _sizeController, curve: Curves.fastLinearToSlowEaseIn));
}

AnimatedContainer(
      width: _width,
      height: _height,
      duration: Duration(milliseconds: 200),
      decoration: BoxDecoration(
        color: _color,
        border: Border.all(
            color: Color(0xFF707070), width: 2, style: BorderStyle.solid),
        borderRadius: BorderRadius.circular(14.0),
      ),
      child: SizeTransition(
                    sizeFactor: _sizeAnimation,
                    axis: Axis.horizontal,
                    axisAlignment: -1,
                    child:
                        Center(child: Image.asset('assets/images/check.png')),
                  ),

或者它什么都不做或者它只通过缩放来制作动画..我怎样才能达到与小部件页面上的示例视频相同的效果？ 我希望这种效果发生在圆形容器内显示一个复选标记图像。 而在此之前，animatedcontainer 将是一个线性容器，变成圆形，然后出现复选标记。

Answer 1

你需要调用_sizeController.forward()来运行动画