Flutter:在从小部件树中删除小部件时,还是在其生命周期结束时,对小部件进行动画处理?



我有一个GridView,它显示网格中项目的自定义小部件。当这些项目出现在网格中时,使用AnimationController.forward((命令可以将其大小从0缩放到100%。

我希望,当网格中的项目列表发生变化,其中一个项目不再在列表中时,我希望在从树中删除小部件之前反转动画,以使其从网格中删除。

我尝试在小部件的dispose方法中执行AnimationController.reverse((,但似乎不起作用。

有没有办法在小部件的生命周期结束时为其设置动画?

你可以试试这个酒吧https://pub.flutter-io.cn/packages/auto_animated.你可以将你的自定义动画与这个酒吧结合起来,并能够达到所需的行为。

// With predefined options
LiveGrid.options(
options: options,
// Like GridView.builder, but also includes animation property
itemBuilder: buildAnimatedItem,
// Other properties correspond to the `ListView.builder` / `ListView.separated` widget
itemCount: itemsCount,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
crossAxisSpacing: 16,
mainAxisSpacing: 16,
),
);

buildAnimatedItem可以是您的自定义动画,您可以这样定义:

Widget buildAnimatedItem(
BuildContext context,
int index,
Animation<double> animation,
) =>
// For example wrap with fade transition
FadeTransition(
opacity: Tween<double>(
begin: 0,
end: 1,
).animate(animation),
// And slide transition
child: SlideTransition(
position: Tween<Offset>(
begin: Offset(0, -0.1),
end: Offset.zero,
).animate(animation),
// Paste you Widget
child: YouWidgetHere(),
),
);

看看酒吧Readme很清楚

最新更新