Flutter: 从部件树中移除部件时，或在其生命周期结束时，对部件进行动画处理？

Question

我有一个GridView，它为网格中的项目显示了自定义部件。 这些项目有一个动画，当它们出现在网格中时，使用AnimationController.forward()命令，将它们的大小从0放大到100%。

我的希望是，当网格中的项目列表发生变化，其中一个项目不再在列表中时，我希望在小组件从树中移除之前将动画反转，使其从网格中移除时产生动画效果。

我试过在部件的dispose方法中做AnimationController.reverse()，但似乎不起作用。

有什么方法可以在widget的生命周期结束时对其进行动画处理？

Answer 1

你可以试试这个pub https:/pub.flutter-io.cnpackagesauto_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就知道了