2

我有一个Firestore包含 4 个不同文档的集合。在我的应用程序中，我有一个列表，显示ListView. 我通过一个Stream. 用户可以删除、移动和添加项目。当用户移动一个项目时，我希望它为该项目在其他项目上方/下方移动的方式设置动画（移动系统是通过赞成票和反对票组成的，最赞成的项目位于顶部，而最反对的项目位于底部）。当一个项目比它上面的项目获得 1 个赞成票时，它应该为项目的开关设置动画。我知道动画列表对此没有任何本机支持。当我获得新数据时，如何告诉我的列表做动画？现在一切看起来都很混乱，一切都在瞬间跳跃，因为普通的 ListView 不提供任何用于移动/插入/删除数据的动画。鉴于我使用异步数据和流，该过程变得更加困难。关于如何检测流中的变化并将当前列表设置为列表的新状态的任何想法？这是否意味着删除/插入/修改某些项目的位置。

4

1 回答 1

1

使用隐式动画列表

https://pub.dev/packages/implicitly_animated_reorderable_list

// Specify the generic type of the data in the list.
ImplicitlyAnimatedList<MyGenericType>(
  // The current items in the list.
  items: items,
  // Called by the DiffUtil to decide whether two object represent the same item.
  // For example, if your items have unique ids, this method should check their id equality.
  areItemsTheSame: (a, b) => a.id == b.id,
  // Called, as needed, to build list item widgets.
  // List items are only built when they're scrolled into view.
  itemBuilder: (context, animation, item, index) {
    // Specifiy a transition to be used by the ImplicitlyAnimatedList.
    // See the Transitions section on how to import this transition.
    return SizeFadeTransition(
      sizeFraction: 0.7,
      curve: Curves.easeInOut,
      animation: animation,
      child: Text(item.name),
    ); 
  },
  // An optional builder when an item was removed from the list.
  // If not specified, the List uses the itemBuilder with 
  // the animation reversed.
  removeItemBuilder: (context, animation, oldItem) {
    return FadeTransition(
      opacity: animation,
      child: Text(oldItem.name),
    );
  },
);
于 2020-06-27T12:40:39.253 回答