Flutter 当没有其他卡显示时，以颤振方式显示一张卡

我有一组连接到我的云firestore的卡，当选择与每张卡相关的图标时，会显示这些卡。但是，我想要一张卡片，当没有其他卡片显示时，它会告诉用户选择一个图标。这是我的代码：

class Tips extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: StreamBuilder(
            stream:
                FirebaseFirestore.instance.collection('moodIcons').snapshots(),
            builder: (context, snapshot) {
              if (!snapshot.hasData) return Text('Loading data... Please Wait');

              var currentCards = 0;

              return Container(
                  child: new ListView(
                    children: snapshot.data.documents.map<Widget>((DocumentSnapshot document) {
                      if (document.data()['display'] == true) {
                          //code to display each card when specific icon is chosen
                      } else {
                        if (currentCards < 1) {
                          currentCards++;
                          return new Card(
                              child: new Column(
                                children: <Widget>[
                                  new Container(
                                    width: 400.0,
                                    height: 45.0,
                                    child: new Text(
                                      "Choose an icon to show a tip!",
                                  ),
                                ],
                              ));

类提示扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回脚手架(
正文：StreamBuilder(
流：
FirebaseFirestore.instance.collection（'moodIcons'）.snapshots（），
生成器：（上下文，快照）{
如果（！snapshot.hasData）返回文本（'正在加载数据…请稍候'）；
var=0；
返回容器(
子：新列表视图(
子项：snapshot.data.documents.map（（DocumentSnapshot文档）{
if（document.data（）['display']==true）{
//选择特定图标时显示每张卡的代码
}否则{
如果（当前卡<1）{
currentCards++；
归还新卡(
子：新列(
儿童：[
新容器(
宽度：400.0，
身高：45.0，
儿童：新文本(
“选择一个图标以显示提示！”，
),
],
));

目前，该卡一直显示，但我希望它在单击图标时消失。单击图标时，

display

的值变为true。 我尝试使用计数器，因此如果

display

的值为true，那么它会向计数器添加一个值，如果计数器大于0，则

else

语句中的卡不会显示。但是，这不起作用，因为我无法从

if

语句中返回计数器的值。

---

任何帮助都将不胜感激！

如果您希望通过

无状态widget

完成此操作，您需要一些状态管理，如

Bloc

或

Riverpod

，您自己的等。 好答案 单击图标时，您需要抽象流并创建事件/操作。 该事件将通过上述方法进行处理。新卡将被推送到流中

---

或者，您可以使小部件

有状态

，创建一个

卡

小部件列表（提供给列表生成器）并使用

setState

将

卡的元素添加到列表中。
如果您希望通过
无状态小部件来完成此操作，则需要一些状态管理，如
Bloc
或
Riverpod
，您自己的等。
好答案
单击图标时，您需要抽象流并创建事件/操作。
该事件将通过上述方法进行处理。新卡将被推送到流中

或者，您可以使小部件
有状态
，创建一个
卡
小部件列表（提供给列表生成器）并使用
设置状态
将
卡的元素添加到列表中。
如果没有
文档
设置为
显示：true
，则可以有条件地在
列表视图
的开头添加项目：

class Tips extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder(
        stream: FirebaseFirestore.instance.collection('moodIcons').snapshots(),
        builder: (context, snapshot) {
          if (!snapshot.hasData) return Text('Loading data... Please Wait');
          return Container(
            child: new ListView(children: [
              if (!snapshot.data.documents
                  .any((doc) => doc.data()['display'] == true))
                Card(child: Text("Choose an icon to show a tip!")),
              ...snapshot.data.documents
                  .where((doc) => doc.data()['display'] == true)
                  .map((doc) => MyWidget(doc))
                  .toList(),
            ]),
          );
        },
      ),
    );
  }
}

如果没有
文档
设置为
display:true
，您可以有条件地在
列表视图
的开头添加一个项目：

class Tips extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder(
        stream: FirebaseFirestore.instance.collection('moodIcons').snapshots(),
        builder: (context, snapshot) {
          if (!snapshot.hasData) return Text('Loading data... Please Wait');
          return Container(
            child: new ListView(children: [
              if (!snapshot.data.documents
                  .any((doc) => doc.data()['display'] == true))
                Card(child: Text("Choose an icon to show a tip!")),
              ...snapshot.data.documents
                  .where((doc) => doc.data()['display'] == true)
                  .map((doc) => MyWidget(doc))
                  .toList(),
            ]),
          );
        },
      ),
    );
  }
}

非常感谢！我刚刚使用了
if（！snapshot.data.documents.any（（doc）=>doc.data（）['display']==true））
它工作得非常好！非常感谢！我刚刚使用了
if（！snapshot.data.documents.any（（doc）=>doc.data（）['display']==true））
它工作得非常好！