【问题标题】:Show/Hide Widgets in ListView with animation使用动画在 ListView 中显示/隐藏小部件
【发布时间】:2021-06-15 21:35:30
【问题描述】:

我有 ListTiles 的 ListView,我只想显示第一个。然后在单击按钮后,我想让其他 ListTiles 也出现在 ListView 中(它们一开始是空容器)。

我尝试在 ListTile 和空 Container 之间使用 AnimatedCrossFade 和 AnimatedSwitcher。我也尝试了一些软件包,但没有运气。我尝试的所有操作都将 Container 与 ListTile 交换,但没有动画。

ListView.separated(
  physics: ClampingScrollPhysics(),
  shrinkWrap: true,
  itemBuilder: (context, index2) => index2 < (!seeAll ? 1 : length)
      ? ListTile(
          //stuff
        )
      : Container(),
  separatorBuilder: (context, index) =>
      seeAll ? Divider() : Container(),
  itemCount: length,
)

这将根据 seeAll 的值在 ListTile 和 Container 之间正确交换,该值会在按下按钮时发生变化,并且将始终显示第一个 ListTile 所需的行为。有没有办法给它添加动画。我不确定为什么上述动画不起作用。 附言 持续时间设置为动画可见的足够时间,所以这不是问题。

【问题讨论】:

标签: flutter listview animation widget


【解决方案1】:

您可以尝试 Visible 小部件,但我不确定动画:

itemBuilder: (context, index2) => 
       Visible(
           visible : index2 < (!seeAll ? 1 : length)
           child : ListTile(
              //stuff
            )
       )

【讨论】:

  • 它可以正确显示和隐藏小部件,我只需要对其进行动画处理。也许有一些可见性状态变化的动画。我会试试的
  • 您可以查看所有 Animated* 小部件 api.flutter.dev/flutter/widgets/AnimatedWidget-class.html (AnimatedOpacity,AnimatedContainer ...) 也许您将不得不重新编写代码。
  • 我尝试使用 AnimatedContainer 和 AnimatedSwitcher 和 AnimatedCrossFade 没有成功。我不确定是什么导致动画不显示。
猜你喜欢
  • 1970-01-01
  • 2019-07-03
  • 2014-07-29
  • 2021-01-17
  • 2017-08-09
  • 2020-03-05
  • 1970-01-01
  • 2011-09-16
  • 2019-06-11
相关资源
最近更新 更多