当页面初始化时，如何设置容器的动画

Question

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",
),
),
],
),
),
),

如有任何建议，将不胜感激

Answer 1

制作动画需要考虑以下几点。

1. 使用AnimationController跟踪动画的当前状态，设置要设置动画的持续时间，如果要添加到动画中，还可以设置其他几个属性
2. 如果你在使用动画，你必须在你的类中使用SingleTikerProviderStateMixin或MultiTikerProviderstateMixin混合

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