显示空的小部件,同时FutureBuilder正在加载数据

huangapple go评论61阅读模式
英文:

Showing empty widget while FutureBuilder is loading data

问题

以下是您要的代码部分的中文翻译:

child: FutureBuilder(
    future: fetchNotifications(widget.usuarioId),
    builder: (context, snapshot) {
        if (snapshot.hasData) {
            List<dynamic>? filteredList = snapshot.data as List;

            return ListView.separated(
                separatorBuilder: (BuildContext context, int index) =>
                    new Divider(
                color: Colors.black26,
                thickness: 0.5,
            ),
            itemCount: filteredList.length,
            shrinkWrap: true,
            itemBuilder: (BuildContext context, index) {
                NotificationModelo notificacion = filteredList[index];
                var textoNot = notificacion.texto;

                print("texto ${notificacion.texto}");
                if (notificacion.texto == "New files available for you" &&
                    _fr) {
                    textoNot = "Nouveaux fichiers disponibles pour vous";
                }

                if (_fr) {}

                return GestureDetector(
                    onTap: () {},
                    child: Container(
                        height: 50,
                        width: MediaQuery.of(context).size.width,
                        color: Colors.white,
                        child: GestureDetector(
                            onTap: () {
                                if (notificacion.categoria == "Travel Document") {
                                    Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                            builder: (context) =>
                                                BDTravelDocumentsNuevo()));
                                }
                                if (notificacion.categoria == "Itinerary") {
                                    Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                            builder: (context) => BDItineraryNuevo()));
                                }
                                if (notificacion.categoria == "Experience") {
                                    Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                            builder: (context) =>
                                                BDExperiencesNuevo()));
                                }
                                if (notificacion.categoria == "News and Promos") {
                                    Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                            builder: (context) =>
                                                PrivateAreaNuevoDos()));
                                }
                            },
                            child: Padding(
                                padding: const EdgeInsets.only(left: 8.0, right: 8.0),
                                child: Card(
                                    elevation: 0,
                                    child: Padding(
                                        padding: const EdgeInsets.all(2.0),
                                        child: Container(
                                            width: MediaQuery.of(context).size.width,
                                            child: Center(
                                                child: new Row(
                                                    mainAxisAlignment:
                                                    MainAxisAlignment.start,
                                                    children: [
                                                        SizedBox(
                                                            width: 10,
                                                        ),
                                                        notificacion.categoria ==
                                                            "Travel Document"
                                                            ? CircleAvatar(
                                                            radius: 20.0,
                                                            backgroundImage: AssetImage(
                                                                "assets/item2.png"),
                                                            backgroundColor:
                                                            Colors.transparent,
                                                        )
                                                            : notificacion.categoria ==
                                                            "Itinerary"
                                                            ? CircleAvatar(
                                                            radius: 20.0,
                                                            backgroundImage: AssetImage(
                                                                "assets/item3.png"),
                                                            backgroundColor:
                                                            Colors.transparent,
                                                        )
                                                            : notificacion.categoria ==
                                                            "Experience"
                                                            ? CircleAvatar(
                                                            radius: 20.0,
                                                            backgroundImage: AssetImage(
                                                                "assets/item4.png"),
                                                            backgroundColor:
                                                            Colors.transparent,
                                                        )
                                                            : CircleAvatar(
                                                            radius: 20.0,
                                                            backgroundImage: AssetImage(
                                                                "assets/logolc.png"),
                                                            backgroundColor:
                                                            Colors.transparent,
                                                        ),
                                                        SizedBox(
                                                            width: 15,
                                                        ),
                                                        Row(
                                                            mainAxisAlignment:
                                                            MainAxisAlignment.start,
                                                            crossAxisAlignment:
                                                            CrossAxisAlignment.center,
                                                            children: [
                                                                Container(
                                                                    width: 199,
                                                                    height: 40,
                                                                    child: Column(
                                                                        mainAxisAlignment:
                                                                        MainAxisAlignment.center,
                                                                        crossAxisAlignment:
                                                                        CrossAxisAlignment.start,
                                                                        children: [
                                                                            Text(
                                                                                "${textoNot}",
                                                                                textAlign: TextAlign.start,
                                                                                maxLines: 1,
                                                                                overflow:
                                                                                TextOverflow.ellipsis,
                                                                                style: TextStyle(
                                                                                    fontSize: 15,
                                                                                    fontWeight:
                                                                                    FontWeight.bold),
                                                                            ),
                                                                        ],
                                                                    ),
                                                                ),
                                                            ],
                                                        ),
                                                        Spacer(),
                                                        GestureDetector(
                                                            onTap: () {},
                                                            child: notificacion.categoria ==
                                                            "Push"
                                                            ? Container()
                                                            : IconButton(
                                                            onPressed: () {
                                                                if (notificacion
                                                                    .categoria ==
                                                                    "Travel Document") {
                                                                    Navigator.push(
                                                                        context,
                                                                        MaterialPageRoute(
                                                                            builder: (context) =>
                                                                                BDTravelDocumentsNuevo()));
                                                                }
                                                                if (notificacion
                                                                    .categoria ==
                                                                    "Itinerary") {
                                                                    Navigator.push(
                                                                        context,
                                                                        MaterialPageRoute(
                                                                            builder: (context) =>
                                                                                BDItineraryNuevo()));
                                                                }
                                                                if (notificacion
                                                                    .categoria ==
                                                                    "Experience") {
                                                                    Navigator.push(
                                                                        context,
                                                                        MaterialPageRoute(
                                                                            builder: (context) =>
                                                                                BDExperiencesNuevo()));
                                                                }
                                                                if (notificacion
                                                                    .categoria ==
                                                                    "News and Promos") {
                                                                    Navigator.push(
                                                                        context,
                                                                        MaterialPageRoute(
                                                                            builder: (context) =>
                                                                                PrivateAreaNuevoDos()));
                                                                }
                                                            },
                                                            icon: Icon(
                                                                Icons.arrow_forward_ios,
                                                            )),
                                                        )
                                                    ],
                                                ),
                                            ),
                                        ),
                                    )),

                            ),
                        ),
                    ),
                );
            },
        );
    }
    return AnyNotification();
}),

希望这有所帮助!如果您需要进一步的翻译或有其他问题,请随时提问。

英文:

I have the following FutureBuilder:

child: FutureBuilder(
future: fetchNotifications(widget.usuarioId),
builder: (context, snapshot) {
if (snapshot.hasData) {
List&lt;dynamic&gt;? filteredList = snapshot.data as List;
return ListView.separated(
separatorBuilder: (BuildContext context, int index) =&gt;
new Divider(
color: Colors.black26,
thickness: 0.5,
),
itemCount: filteredList.length,
shrinkWrap: true,
itemBuilder: (BuildContext context, index) {
NotificationModelo notificacion = filteredList[index];
var textoNot = notificacion.texto;
print(&quot;texto ${notificacion.texto}&quot;);
if (notificacion.texto == &quot;New files available for you&quot; &amp;&amp;
_fr) {
textoNot = &quot;Nouveaux fichiers disponibles pour vous&quot;;
}
if (_fr) {}
return GestureDetector(
onTap: () {},
child: Container(
height: 50,
width: MediaQuery.of(context).size.width,
color: Colors.white,
child: GestureDetector(
onTap: () {
if (notificacion.categoria == &quot;Travel Document&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt;
BDTravelDocumentsNuevo()));
}
if (notificacion.categoria == &quot;Itinerary&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt; BDItineraryNuevo()));
}
if (notificacion.categoria == &quot;Experience&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt;
BDExperiencesNuevo()));
}
if (notificacion.categoria == &quot;News and Promos&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt;
PrivateAreaNuevoDos()));
}
},
child: Padding(
padding: const EdgeInsets.only(left: 8.0, right: 8.0),
child: Card(
elevation: 0,
child: Padding(
padding: const EdgeInsets.all(2.0),
child: Container(
width: MediaQuery.of(context).size.width,
child: Center(
child: new Row(
mainAxisAlignment:
MainAxisAlignment.start,
children: [
SizedBox(
width: 10,
),
notificacion.categoria ==
&quot;Travel Document&quot;
? CircleAvatar(
radius: 20.0,
backgroundImage: AssetImage(
&quot;assets/item2.png&quot;),
backgroundColor:
Colors.transparent,
)
: notificacion.categoria ==
&quot;Itinerary&quot;
? CircleAvatar(
radius: 20.0,
backgroundImage: AssetImage(
&quot;assets/item3.png&quot;),
backgroundColor:
Colors.transparent,
)
: notificacion.categoria ==
&quot;Experience&quot;
? CircleAvatar(
radius: 20.0,
backgroundImage: AssetImage(
&quot;assets/item4.png&quot;),
backgroundColor:
Colors.transparent,
)
: CircleAvatar(
radius: 20.0,
backgroundImage: AssetImage(
&quot;assets/logolc.png&quot;),
backgroundColor:
Colors.transparent,
),
SizedBox(
width: 15,
),
Row(
mainAxisAlignment:
MainAxisAlignment.start,
crossAxisAlignment:
CrossAxisAlignment.center,
children: [
Container(
width: 199,
height: 40,
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
&quot;${textoNot}&quot;,
textAlign: TextAlign.start,
maxLines: 1,
overflow:
TextOverflow.ellipsis,
style: TextStyle(
fontSize: 15,
fontWeight:
FontWeight.bold),
),
],
),
),
],
),
Spacer(),
GestureDetector(
onTap: () {},
child: notificacion.categoria ==
&quot;Push&quot;
? Container()
: IconButton(
onPressed: () {
if (notificacion
.categoria ==
&quot;Travel Document&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt;
BDTravelDocumentsNuevo()));
}
if (notificacion
.categoria ==
&quot;Itinerary&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt;
BDItineraryNuevo()));
}
if (notificacion
.categoria ==
&quot;Experience&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt;
BDExperiencesNuevo()));
}
if (notificacion
.categoria ==
&quot;News and Promos&quot;) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =&gt;
PrivateAreaNuevoDos()));
}
},
icon: Icon(
Icons.arrow_forward_ios,
)),
)
],
),
),
),
)),
),
),
),
);
},
);
}
return AnyNotification();
}),

It is working as it should, the only issue is that I need to show the list data just after loading the data is finished, and now during loading time it is showing the widget AnyNotification(), which I want to show only when there are any data to show.

My customer doesn´t want to show anything during loading time.

答案1

得分: 1

以下是代码的翻译部分:

return FutureBuilder(
  future: future,
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return CircularProgressIndicator();
    }

    if (snapshot.hasError) {
      return Text("出现错误");
    }

    if (snapshot.hasData) {
      List<dynamic>? filteredList = snapshot.data as List?;
      if (filteredList == null || filteredList.isEmpty) {
        return AnyNotification();
      } else {
        return ListView.separated(
          itemBuilder: itemBuilder,
          separatorBuilder: separatorBuilder,
          itemCount: itemCount,
        );
      }
    }

    return Text("NA 状态");
  },
);

了解更多关于 FutureBuilder-class

英文:

You can follow this structure.

return FutureBuilder(
  future: future,
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return CircularProgressIndicator();
    }

    if (snapshot.hasError) {
      return Text(&quot;got error&quot;);
    }

    if (snapshot.hasData) {
      List&lt;dynamic&gt;? filteredList = snapshot.data as List?;
      if (filteredList == null || filteredList.isEmpty) {
        return AnyNotification();
      } else {
        return ListView.separated(
          itemBuilder: itemBuilder,
          separatorBuilder: separatorBuilder,
          itemCount: itemCount,
        );
      }
    }

    return Text(&quot;NA State&quot;);
  },
);

Find more about FutureBuilder-class.

答案2

得分: 1

以下是您提供的Dart代码的翻译部分:

FutureBuilder(
  future: fetchNotifications(widget.usuarioId),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return const CircularProgressIndicator();
    }

    if (snapshot.hasError) {
      return const Text("Error");
    }

    if (snapshot.hasData) {
      List<dynamic>? filteredList = snapshot.data as List;

      return ListView.separated(
        separatorBuilder: (BuildContext context, int index) => const Divider(color: Colors.black26, thickness: 0.5),
        itemCount: filteredList.length,
        shrinkWrap: true,
        itemBuilder: (BuildContext context, index) {
          NotificationModelo notificacion = filteredList[index];
          var textoNot = notificacion.texto;

          print("texto ${notificacion.texto}");
          if (notificacion.texto == "New files available for you" && _fr) {
            textoNot = "Nouveaux fichiers disponibles pour vous";
          }

          if (_fr) {}

          return GestureDetector(
            onTap: () {},
            child: Container(
              height: 50,
              width: MediaQuery.of(context).size.width,
              color: Colors.white,
              child: GestureDetector(
                onTap: () {
                  if (notificacion.categoria == "Travel Document") {
                    Navigator.push(context, MaterialPageRoute(builder: (context) => BDTravelDocumentsNuevo()));
                  }
                  if (notificacion.categoria == "Itinerary") {
                    Navigator.push(context, MaterialPageRoute(builder: (context) => BDItineraryNuevo()));
                  }
                  if (notificacion.categoria == "Experience") {
                    Navigator.push(context, MaterialPageRoute(builder: (context) => BDExperiencesNuevo()));
                  }
                  if (notificacion.categoria == "News and Promos") {
                    Navigator.push(context, MaterialPageRoute(builder: (context) => PrivateAreaNuevoDos()));
                  }
                },
                child: Padding(
                  padding: const EdgeInsets.only(left: 8.0, right: 8.0),
                  child: Card(
                    elevation: 0,
                    child: Padding(
                      padding: const EdgeInsets.all(2.0),
                      child: SizedBox(
                        width: MediaQuery.of(context).size.width,
                        child: Center(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: [
                              const SizedBox(width: 10),
                              notificacion.categoria == "Travel Document"
                                  ? const CircleAvatar(
                                      radius: 20.0,
                                      backgroundImage: AssetImage("assets/item2.png"),
                                      backgroundColor: Colors.transparent,
                                    )
                                  : notificacion.categoria == "Itinerary"
                                      ? const CircleAvatar(
                                          radius: 20.0,
                                          backgroundImage: AssetImage("assets/item3.png"),
                                          backgroundColor: Colors.transparent,
                                        )
                                      : notificacion.categoria == "Experience"
                                          ? const CircleAvatar(
                                              radius: 20.0,
                                              backgroundImage: AssetImage("assets/item4.png"),
                                              backgroundColor: Colors.transparent,
                                            )
                                          : const CircleAvatar(
                                              radius: 20.0,
                                              backgroundImage: AssetImage("assets/logolc.png"),
                                              backgroundColor: Colors.transparent,
                                            ),
                              const SizedBox(width: 15),
                              Row(
                               mainAxisAlignment: MainAxisAlignment.start,
                                crossAxisAlignment: CrossAxisAlignment.center,
                                children: [
                                  SizedBox(
                                    width: 199,
                                    height: 40,
                                    child: Column(
                                      mainAxisAlignment: MainAxisAlignment.center,
                                      crossAxisAlignment: CrossAxisAlignment.start,
                                      children: [
                                        Text(
                                          "$textoNot",
                                         textAlign: TextAlign.start,
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                          style: const TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
                                        ),
                                      ],
                                    ),
                                  ),
                                ],
                              ),
                              const Spacer(),
                              GestureDetector(
                                onTap: () {},
                                child: notificacion.categoria == "Push"
                                    ? Container()
                                    : IconButton(
                                        onPressed: () {
                                          if (notificacion.categoria == "Travel Document") {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) => BDTravelDocumentsNuevo()));
                                          }
                                          if (notificacion.categoria == "Itinerary") {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) => BDItineraryNuevo()));
                                          }
                                          if (notificacion.categoria == "Experience") {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) => BDExperiencesNuevo()));
                                          }
                                          if (notificacion.categoria == "News and Promos") {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) => PrivateAreaNuevoDos()));
                                          }
                                        },
                                        icon: const Icon(
                                          Icons.arrow_forward_ios,
                                        ),
                                      ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            ),
          );
        },
      );
    }
    return AnyNotification();
  },
),

请注意,翻译中包括了代码中的注释和字符串。如果有任何其他需要翻译的内容,请提供具体的文本。

英文:

Try the following code:

FutureBuilder(
  future: fetchNotifications(widget.usuarioId),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return const CircularProgressIndicator();
    }

    if (snapshot.hasError) {
      return const Text(&quot;Error&quot;);
    }

    if (snapshot.hasData) {
      List&lt;dynamic&gt;? filteredList = snapshot.data as List;

      return ListView.separated(
        separatorBuilder: (BuildContext context, int index) =&gt; const Divider(color: Colors.black26,thickness: 0.5),
        itemCount: filteredList.length,
        shrinkWrap: true,
        itemBuilder: (BuildContext context, index) {
          NotificationModelo notificacion = filteredList[index];
          var textoNot = notificacion.texto;

          print(&quot;texto ${notificacion.texto}&quot;);
          if (notificacion.texto == &quot;New files available for you&quot; &amp;&amp; _fr) {
            textoNot = &quot;Nouveaux fichiers disponibles pour vous&quot;;
          }

          if (_fr) {}

          return GestureDetector(
            onTap: () {},
            child: Container(
              height: 50,
              width: MediaQuery.of(context).size.width,
              color: Colors.white,
              child: GestureDetector(
                onTap: () {
                  if (notificacion.categoria == &quot;Travel Document&quot;) {
                    Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; BDTravelDocumentsNuevo()));
                  }
                  if (notificacion.categoria == &quot;Itinerary&quot;) {
                    Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; BDItineraryNuevo()));
                  }
                  if (notificacion.categoria == &quot;Experience&quot;) {
                    Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; BDExperiencesNuevo()));
                  }
                  if (notificacion.categoria == &quot;News and Promos&quot;) {
                    Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; PrivateAreaNuevoDos()));
                  }
                },
                child: Padding(
                  padding: const EdgeInsets.only(left: 8.0, right: 8.0),
                  child: Card(
                    elevation: 0,
                    child: Padding(
                      padding: const EdgeInsets.all(2.0),
                      child: SizedBox(
                        width: MediaQuery.of(context).size.width,
                        child: Center(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: [
                              const SizedBox(width: 10),
                              notificacion.categoria == &quot;Travel Document&quot;
                                  ? const CircleAvatar(
                                      radius: 20.0,
                                      backgroundImage: AssetImage(&quot;assets/item2.png&quot;),
                                      backgroundColor: Colors.transparent,
                                    )
                                  : notificacion.categoria == &quot;Itinerary&quot;
                                      ? const CircleAvatar(
                                          radius: 20.0,
                                          backgroundImage: AssetImage(&quot;assets/item3.png&quot;),
                                          backgroundColor: Colors.transparent,
                                        )
                                      : notificacion.categoria == &quot;Experience&quot;
                                          ? const CircleAvatar(
                                              radius: 20.0,
                                              backgroundImage: AssetImage(&quot;assets/item4.png&quot;),
                                              backgroundColor: Colors.transparent,
                                            )
                                          : const CircleAvatar(
                                              radius: 20.0,
                                              backgroundImage: AssetImage(&quot;assets/logolc.png&quot;),
                                              backgroundColor: Colors.transparent,
                                            ),
                              const SizedBox(width: 15),
                              Row(
                               mainAxisAlignment: MainAxisAlignment.start,
                                crossAxisAlignment: CrossAxisAlignment.center,
                                children: [
                                  SizedBox(
                                    width: 199,
                                    height: 40,
                                    child: Column(
                                      mainAxisAlignment: MainAxisAlignment.center,
                                      crossAxisAlignment: CrossAxisAlignment.start,
                                      children: [
                                        Text(
                                          &quot;$textoNot&quot;,
                                         textAlign: TextAlign.start,
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                          style: const TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
                                        ),
                                      ],
                                    ),
                                  ),
                                ],
                              ),
                              const Spacer(),
                              GestureDetector(
                                onTap: () {},
                                child: notificacion.categoria == &quot;Push&quot;
                                    ? Container()
                                    : IconButton(
                                        onPressed: () {
                                          if (notificacion.categoria == &quot;Travel Document&quot;) {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; BDTravelDocumentsNuevo()));
                                          }
                                          if (notificacion.categoria == &quot;Itinerary&quot;) {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; BDItineraryNuevo()));
                                          }
                                          if (notificacion.categoria == &quot;Experience&quot;) {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; BDExperiencesNuevo()));
                                          }
                                          if (notificacion.categoria == &quot;News and Promos&quot;) {
                                            Navigator.push(context, MaterialPageRoute(builder: (context) =&gt; PrivateAreaNuevoDos()));
                                          }
                                        },
                                        icon: const Icon(
                                          Icons.arrow_forward_ios,
                                        ),
                                      ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            ),
          );
        },
      );
    }
    return AnyNotification();
  },
),

huangapple
  • 本文由 发表于 2023年2月18日 02:33:00
  • 转载请务必保留本文链接:https://go.coder-hub.com/75488083.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定