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() 才能运行动画

如何在Flutter中真正使用SizeTransition？

1 个答案: