在销毁时反转小部件动画

Question

我正在尝试创建一个小部件动画，并在它被销毁时反转动画，但无法找出我应该在哪里调用反转方法。下面是我如何做到的

class _MyAnimatedWidgetState extends State<MyAnimatedWidget>
with SingleTickerProviderStateMixin {
late AnimationController controller;
late Animation<double> animation;
@override
void initState() {
super.initState();
controller = AnimationController(
vsync: this, duration: const Duration(milliseconds: 400));
animation = Tween<double>(begin: 0, end: 1).animate(controller);
controller.forward();
}
@override
Widget build(BuildContext context) {
return SizeTransition(
axis: Axis.vertical,
sizeFactor: animation,
child: Container(
height: 400,
color: Colors.blue,
width: double.infinity,
),
);
}
@override
void dispose() {
controller.reverse();
controller.dispose();
super.dispose();
}
}

动画在创建时效果很好，但反向方法没有效果。

Answer 1

如果小部件正在被其他小部件替换，请使用AnimatedSwitcher(本周视频小部件)

如果你想让小部件在导航时变成动画，请阅读这里。