Question

我有一个ListView，其排序取决于其项目状态：Item模型对象具有bool属性，isActive和所有Item值true的值先排在false之前。轻触项目可切换其isActive状态。列表本身未完成设置状态的逻辑；而是由BLoC执行，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中的itemBuilder参数，因为我不知道该怎么用。

如何在Flutter中实现这一点？

在Flutter中对ListView项进行动画处理

0 个答案: