动画 ListView 项目在 Flutter 中的位置变化

Question

我有一个ListView它的排序取决于它的项目状态：Item模型对象有一个bool属性，isActive，并且所有Item值为 的 strue在所有值为 的 s之前排序false。点击一个项目会切换它的isActive状态。设置状态的逻辑不是在列表本身中完成的；相反，它由 BLoC 执行，它也知道如何对项目进行排序。结果，所有列表得到的是一个List<Item>正确排序的流。

目前，结果非常不和谐 - 被点击的项目从它的位置消失并出现在列表中的其他地方，我想让它更平滑，比如可能动画位置变化 - 就像什么ReorderableListView一样，但以编程方式。我不知道该怎么做，我开始胡思乱想，AnimatedList但我不确定这是否适合我的用例 - 它可以为删除和添加设置动画，这不是我真正在做什么（我可以添加一个立即删除，然后添加，但这似乎很复杂）。

这是我到目前为止的代码（简化），它支持动画移除：

class ItemListWidget extends StatelessWidget {
  final items = [
    'Item A',
    'Item B',
    'Item C',
    'Item D',
    'Item E',
  ];

  @override
  Widget build(BuildContext context) {
    return AnimatedList(
      initialItemCount: items.length,
      itemBuilder: (context, index, animation) {
        final item = items[index];
        return ListTile(
          title: Text(item),
          onTap: () {
            final state = AnimatedList.of(context);
            state.removeItem(
              index,
              (context, animation) => SizeTransition(
                sizeFactor: animation,
                child: ListTile(title: Text(item)),
              ),
              // duration: const Duration(seconds: 5),
            );
            items.removeAt(index);
          },
        );
      },
    );
  }
}

它确实删除了该项目，我现在需要在删除动画准备好时以某种方式在不同的索引处再次附加添加该项目。但这似乎不对，我认为我无法为该位置设置动画

另一件事是我对 API 很困惑，我不确定我是否正确使用它。我从不使用animation参数 initemBuilder因为我不明白我可以用它做什么。

我如何在 Flutter 中实现这一点？