我目前正在开发Flutter应用程序,该应用程序使用许多REST API与服务器端进行通信。 我面临一些与FutureBuilder小部件相关的性能问题,具体实现如下:

RefreshIndicator(
  displacement: 100.0,
  onRefresh: _refreshLastEntries,
  child: FutureBuilder<List<Entry>> (
    future: lastEntriesList,
    builder: (context, snapshot) {
      if(snapshot.hasError) print(snapshot.error);
      if(snapshot.data == null) return Container();
      else return ListView.builder(
        controller: _controller,
        itemCount: snapshot.data.length,
        itemBuilder: (context, index) {
          return Padding(
            padding: const EdgeInsets.all(10.0),
            child: EntryCard(entry: snapshot.data[index])
          );
        },
      );
    },
  ),
),

顺便说一句,在同一页面构建中,还有2个带有RefreshIndicator的FutureBuilder实现,并用PageView包装。 Android Studio中的Flutter Performance选项卡显示平均值。 在调试模式下为30帧/秒(有时<30)的fps。 在释放模式下效果更好,但仍低于60 fps,我可以注意到动画缓慢。

好吧,我知道问题(虽然不确定)是FutureBuilder尝试重建,只要AsyncSnapshot具有数据即可。 但是我想不出更好的实现方法。 刷新功能_refreshLastEntries()实现为:

Future<Null> _refreshLastEntries() async {
  setState(() {
     lastEntriesList = fetchLastEntries(2);
  });
  return Future.delayed(Duration(milliseconds: 600));
}

fetchLastEntries(int)仅用于获取数据并将其映射到某些EntryModel类中。 成功获取数据后,我尝试设置全局值,然后将其用于构建ListView,但是它不起作用。

如果有问题,我正在使用配备Snapdragon 835和Adreno 540的Xiaomi MI6测试此应用程序。

我不会将任何其他代码附加为整个PageView构建代码,因为很难重现相同的构建,谢谢!

#1楼 票数:1

如果将来的状态不变,则不应重建FutureBuilder小部件。 您的情况可能是

setState(() {
   lastEntriesList = fetchLastEntries(2);
});

_refreshLastEntries()内部会导致未完成future的重建,完成后会通过FutureBuilder进行另一次重建。

由于您使用的是RefreshIndicator,因此我认为您不需要FutureBuilder。 _refreshLastEntries()进行异步工作,完成后,更新ListView.builder小部件。 要更清楚:

//Declare lastEntriesList as a list
List<Entry> lastEntriesList;

Future<void> _refreshLastEntries() async {
  return fetchLastEntries(2).then((lastEntries) {
    setState(() {
      lastEntriesList = lastEntries;
    });
  });
}

并如下修改您的子树:

RefreshIndicator(
  displacement: 100.0,
  onRefresh: _refreshLastEntries,
  child: ListView.builder(
    controller: _controller,
    itemCount: lastEntriesList.length,
    itemBuilder: (context, index) {
      return Padding(
        padding: const EdgeInsets.all(10.0),
        child: EntryCard(entry: lastEntrieslist[index])
      );
    },
  );,
)

  ask by Firat translate from so

未解决问题?本站智能推荐:

1回复

使用FutureBuilder时的null方法

当我在控制台上打印响应体时,我试图从这个 url 获取 json 但是当我尝试在 Future Builder 中获取一些值时,它给出了这个错误 方法 '[]' 在 null 上被调用。
2回复

Flutter:FutureBuilder从calsses接收null

我正在尝试制作实时比分应用程序,我有一个由 quiqtype.io 从 json 创建的模型: 我创建的 API 服务类: 我现在正在尝试在此页面中查看未来构建中的这些数据: 当我加载此页面时,在控制台成功打印的数据列表但未来的构建器接收空值,因此只查看文本“正在加载...”,并且没有错误没有发现异
1回复

在Json数据中更新后未显示ListView

状态响应代码为 200,但 ListView 未显示并停留在 CircularProgressIndicator 上。 当我在 Json 数据中有 2 个项目时,它显示得很好,但是当我添加另一个项目时,它没有显示! 我已经尝试删除 ListView.separated 并使用 ListView.bu
2回复

在initState()中调用Future方法时,使用FutureBuilder调用FlutterAPI会返回错误

我试图调用需要在第一次构建页面时加载的 API。 所以我使用了 FutureBuilder 并编写了一个 initState 调用。 每个页面都可以正常工作,但仅在一页上,我遇到了上下文问题。 然后我了解了 didChangeDependencies。 这是从另一个类(也需要访问当前小部件上下文)调
1回复

我有本地列表中的静态Gridview如何使其动态化

我现在有本地列表中的 gridview 我想从 api 填充 gridview 任何想法如何做到这一点, 这就是我的 api 响应的样子 这是我的 gridview 静态(本地列表)代码 这是我的 GridProduct 类 这是我的 api 请求,我正在打印响应,但我不知道如何从 Api 响应填充
1回复

FlutterBindJson数据在ListView中未显示在UI中

我的 Json 响应状态代码是 200 并且该对象也已创建,但是当我尝试将它与 ListView 中的 UI 绑定时,它不显示任何内容。 我还从 json 数据解析创建了模型。 这是我的 API_manager.dart 文件: 我的用户界面代码: 输出屏幕:此处应显示 ListView Dart
1回复

来自API调用的JSON数据未显示在ListViewFutureBuilderFlutter中

我的 Json 响应状态代码是 200 并且该对象也已创建,但是当我尝试将它与 ListView 中的 UI 绑定时,它不显示任何内容。 我使用 quicktype.io 来解析我从 API 调用中收到的 json 数据。 这是我的 API_manager.dart 文件: 我的用户界面代码: 创建
2回复

更改TextField,调用api-如何限制它?

如果我有一个文本字段,并且在该文本字段中进行更改,我调用一个调用API的函数,我该如何限制它,所以只有当用户没有键入任何内容1秒钟时才会调用该函数? 我迷失在这里..任何帮助都非常受欢迎。