如何制作进度条以接收来自 API 的响应？答案

【问题标题】：How to make progress bar for receiving response from API?如何制作进度条以接收来自 API 的响应？
【发布时间】：2020-11-18 14:25:10
【问题描述】：

从 API 接收数据到 Flutter 应用程序需要时间来接收。如何在 Flutter 应用收到 JSON 数据并移动到应用的下一个屏幕之前加载进度条。

我没有使用 ListView.Builder。相反，我也将它用于文本、下拉列表和其他内容。

【问题讨论】：

标签： api flutter dart

【解决方案1】：

您可以使用 FutureBuilder 小部件，如 cookbook for retrieving and displaying data 所示：

FutureBuilder<Album>(
  future: futureAlbum,
  builder: (context, snapshot) {
    if (snapshot.hasData) {
      return Text(snapshot.data.title);
    } else if (snapshot.hasError) {
      return Text("${snapshot.error}");
    }

    // By default, show a loading spinner.
    return CircularProgressIndicator();
  },
);

此小部件允许您使用有关正在加载的数据和加载本身的状态的信息来构建布局。

对于future:参数，给他你的http.get请求。

在builder: 参数中，给它一个匿名函数来构建您想要显示的内容。在上述关闭中，您可以依靠snapshot 了解数据是否已完成下载（snapshot.hasData）或是否有错误下载（snapshot.hasError）。要显示您要求的进度条，您可以推断状态：如果快照没有数据也没有任何错误，则它正在加载并且您将进度条返回给用户。

【讨论】：