问题标签 [flutter-animatedlist]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
209 浏览

flutter - listview onTap 动画所有按钮问题:Flutter

列表视图上的 GestureDetector 为列表视图中的所有小部件设置动画,我该如何阻止它。我在 listview 项目上有 Transform.scale ,当我点击小部件时,只有该小部件应该动画,但这里所有其他 listview 项目都在动画。

动画按钮/小部件

0 投票
1 回答
953 浏览

flutter - Flutter AnimatedList 与提供者模式

我有实现 ChangeNotifier 的模型

和一个监听这些变化的 ListView:

到目前为止一切顺利,当将项目添加到模型中的列表时,更改通知会触发 Listview 的重建,我会看到新数据。但是我无法将其与 AnimatedList 而不是 ListView 一起使用。最好 id 喜欢保持我的模型原样,因为动画是 ui 的关注点,而不是我的逻辑关注点。

changenotifier 总是为我提供最新版本的数据,但我真正需要的是“添加项目”或“删除项目”通知。

有没有这样做的最佳实践方法?

0 投票
0 回答
558 浏览

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

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

目前,结果非常不和谐 - 被点击的项目从其位置消失并出现在列表中的其他位置,我想让它更平滑,比如可能为位置变化设置动画 - 类似于做什么ReorderableListView,但以编程方式。我不知道该怎么做,我开始搞砸了,AnimatedList但我不确定这是我用例的正确组件 - 它可以动画删除和添加,这不是我正在做的事情(我可以​​添加一个删除后立即添加,但这似乎很复杂)。

这是我到目前为止的代码(简化),它支持动画删除:

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

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

如何在 Flutter 中实现这一点?

0 投票
1 回答
185 浏览

flutter - Flutter SlideTransition 与 AnimatedList

本周的小部件视频中,他们展示了为这样的项目设置动画的代码:

我不知道如何配置MyTween()以在屏幕上显示孩子开始,然后稍后滑出屏幕。

我终于找到了答案,所以我在下面分享它。

0 投票
1 回答
898 浏览

flutter - List 中的动画,带有 Stream 提供的异步数据

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

0 投票
0 回答
239 浏览

flutter - Flutter AnimatedList 与 BlocListener

我正在尝试AnimatedList使用MessengerBloc可以接受MessengerEvent.pushed(Message)MessengerBloc.popped(Message). 当状态改变时,它会监听并比较之前的状态和当前的状态,以确定必须添加/删除/移动哪个项目索引。到目前为止有效,所以为了简洁起见,我删除了这些代码。

问题

当我添加MessengerEvent.pushed(Message)这是打印语句的序列:

message was added

building messages

[Message()]// 从print(messages)里面_buildOverlay()

index0: []// 从print('index$index: $messages')里面AnimatedList.itemBuilder

index0: [Message()]// 从print('index$index: $messages')里面AnimatedList.itemBuilder

问题:为什么messagesinAnimatedList.itemBuilder打印出来emptyList,然后在更新后再次运行messages

0 投票
1 回答
151 浏览

flutter - 如何使堆叠的卡片动画以彼此落后

我正在尝试制作一个只有 2 个项目的 PageView。但我想看看第一个背后的卡片。当它向右滑动时,我希望它动画到后面,后面的卡片动画到前面。 在此处输入图像描述

我找到了一个类似的解决方案,但并不完全是 Flutter Swiper。它确实让我可以看到后面的卡片,但它并没有我想要的那么多,而且它没有动画到后面,而是它只是消失在右边。另外,我想让它在右侧而不是左侧“弹出”。

在此处输入图像描述

任何帮助都有助于为我指明方向。谢谢。

0 投票
1 回答
254 浏览

flutter - 一起为多个列表项设置动画(展开/折叠)

有没有一种方法可以将多个 listView 项作为一个块一起制作动画,以制作展开/折叠动画。我尝试了 AnimatedList,但它一个一个地为项目设置动画,而不是作为一组或一个块。ExpansionTile 和 ExpansionPanel 对我不起作用,因为它们在开始时会创建所有子级,并且如果一个组中有 100 个子级 - 这 100 个小部件将一次创建,这对性能非常不利,即使在发布版本中也是如此。

0 投票
1 回答
145 浏览

flutter - Flutter中的AnimatedList和SliverAnimatedList:如何解决批量操作时重复项的问题

我在我的应用程序中使用 SliverAnimatedList 来显示项目列表。

我还实现了几个过滤器。如果我单击按钮 A,列表中的某些项目应该会显示,而其他项目会被删除。按钮 B、C 和 D 也是如此。我正在使用 for 循环在 SliverAnimatedListState 中添加和删除项目。

例如:

过滤如下:

  1. 通过迭代每个当前元素并运行删除动画从原始列表中删除所有实体
  2. 一次添加一个成员,使用交错动画,使用 Future 延迟。

再次单击该按钮将删除所有项目并重新添加原始列表。

因为我使用的是 for 循环,所以用户可能会单击按钮 A,然后单击按钮 B,或者在所有添加/删除操作完成之前取消单击按钮 A 并返回,这会导致出现重复项。例如:

我将如何解决这个问题?自然,如果我使用 SliverList 或没有动画的常规列表,我会避免使用 for 循环,然后一切都按预期工作,但我想保留动画,我想知道是否有人有如何处理的示例AnimatedList 或 SliverAnimatedList 中的批量操作。

0 投票
1 回答
120 浏览

flutter - 将 Text 小部件添加到其子项映射到 Flutter 的 ListView?

我有一个 ListView 可以动态地从地图中显示其子项。ListView 位于显示和隐藏 ListView 的动画控制器内。如何将一个 Text 小部件添加到 ListView 的底部?或者我应该改用 ListView.builder 吗?