时间戳

首页 > 解决方案 > 计算方法未在 FutureBuilder 中调用

flutter - 计算方法未在 FutureBuilder 中调用

问题描述

我注意到一旦选择了大文件，我的应用程序就会被冻结。所以我想出了一个想法，让字节在隔离线程中生成。一旦完成生成，让它显示在Image小部件中。

第一个选择的文件将被添加到 urlImageSink。

@override
  Future<String>userImage(File images) async {
    if (images.path.contains(".pdf")) {
      urlListImages.add(images.path);
      _bloc.urlImageSink.add(urlListImages);
    } 
  }

接下来它将运行StreamBuilder，调用loadPdfFirstPagein FutureBuilder。

 Widget _showAttachFile() {
    return Padding(
      padding: EdgeInsets.all(10),
      child: StreamBuilder<List<dynamic>>(
          stream: _bloc.urlImageStream,
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return GridView.builder(
                  shrinkWrap: true,
                  physics: NeverScrollableScrollPhysics(),
                  gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3,
                    mainAxisSpacing: 5.0,
                    crossAxisSpacing: 5.0,
                  ),
                  itemCount: snapshot.data.length + 1,
                  itemBuilder: (BuildContext context, int index) => new Padding(
                        padding: const EdgeInsets.all(5.0),
                        child: Container(
                          padding: EdgeInsets.zero,
                          height: 150,
                          width: 150,
                          child: FutureBuilder<Uint8List>(
                            future:
                                loadPdfFirstPage(File(snapshot.data[index])),
                            builder: (context, snapshot) {
                              switch (snapshot.connectionState) {
                                case ConnectionState.done:
                                  if (snapshot.hasData) {
                                    return Image(
                                        image: MemoryImage(snapshot.data));
                                     );
                                  } else {
                                    return Text("Null");
                                  }
                                  break;

                                case ConnectionState.waiting:
                                  return CircularProgressIndicator();
                                  break;

                                default:
                                  return Text("Error");
                              }
                            },
                          ),
                        ),
                      ));
            } else {
              return Text("No Data");
            }
          }),
    );
  }

在 loadPdfFirstPage 方法中，我运行计算方法来生成字节。

Future<Uint8List> loadPdfFirstPage(File pdfFile) =>
      compute(generateBytes, pdfFile);

  Future<Uint8List> generateBytes(File pdfFile) async {
    final document = await PdfDocument.openFile(pdfFile.path);
    final page = await document.getPage(1);
    final pageImage = await page.render(width: page.width, height: page.height);
    await page.close();

    return pageImage.bytes;
  }

每次选择文件时，我都会立即Null从 FutureBuilder snapshot.data 中获取输出。好像 loadPdfFirstPage没有打电话。

我在这里做错了什么？

标签： flutterdartstream-builderflutter-futurebuilderisolation

解决方案

您当前的问题似乎是，您还没有创建一个变量来保存您的未来。从 build 方法创建的 FutureBuilder 将一遍又一遍地调用该方法。每次调用 build 方法时都会调用它。

您需要一个地方来创建您想要等待的未来，并且它必须在构建方法中的其他地方。

也就是说，如果我正确解释了名为 _bloc 的变量，那么您使用的是 BLoC 模式吗？你应该有事件和状态。您不应该需要 FutureBuilder，拥有一个新文件应该是一个事件，等待它加载应该是一个状态，加载完成应该是它自己的状态。然后你的 BLoC 类中有一个逻辑，它有一个流程，你有一个 UI，不需要知道什么触发了什么，只显示状态。

推荐阅读