时间戳

首页 > 解决方案 > 如何在页面初始化时为容器设置动画；

flutter - 如何在页面初始化时为容器设置动画；

问题描述

class _MaintenanceState extends State<Maintenance> {

下面的函数应该初始化动画

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

var loginWidth = 0.0;
Curve _curve = Curves.fastOutSlowIn;
_animate() {
  setState(() {
    loginWidth == 0.0 ? loginWidth = 130 : loginWidth = 0.0;
  });
}

我尝试将动画容器的宽度放在其中， initState但它仍然没有动画。

                  AnimatedContainer(
                    duration: Duration(seconds: 1),
                    width: loginWidth,
                    height: 60.0,
                    decoration: BoxDecoration(

                      color: Colors.green[600],
                      borderRadius: BorderRadius.circular(20.0),
                    ),
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Row(
                        children: [
                          Text("Add \nProject"),
                              )),
                          Spacer(),
                          Image(
                            image: AssetImage(
                              "assets/images/add_icon.png",
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),

我们欢迎所有的建议

标签： flutterdart

解决方案

制作动画需要考虑几件事情。

  1. 如果要添加动画，请使用 AnimationController 跟踪动画的当前状态，设置动画的持续时间和其他几个属性。
  2. 如果您使用动画，则必须在您的班级中使用 SingleTickerProviderStateMixin 或 MultiTickerProviderStateMixin mixin。

我正在分享我的 GitHub 项目链接，其中我使用了一个简单的动画，您可以参考它。

推荐阅读