当我只有 Stream<List<int>> 时,如何使用 Image.memory 在 Flutter Web 中显示图像?数据类型?

How do I display an image in a Flutter Web using Image.memory when I only have a Stream<List<int>>? data-type?

概览:

我正在使用 file-picker library 允许用户从他们的设备 select 一个或多个文件。 selected 文件将能够在使用 HTTP/Multipart.

发送 selected 文件进行存储之前进行预览

问题: 文件选择器库 return 是 List\<PlatformFile>,我可以访问 Uint8List?Stream<List\<int>>?

readStreamwithData 都设置为 True 不会 return 同时 Uint8List?Stream<List\<int>>? - 我认为这会有所帮助。

如果我使用 Uint8List? 我可以使用 Flutter Image.memory 方法加载文件但是我无法使用 Uint8List 来使用 http.MultiPartFile.fromBytes()因为它只接受 List<int>.

或者,如果我使用 Stream<List<int>>?,我可以使用 http.MultipartFile() 并传入 Stream<List\<int>>?,但我不确定如何生成 [=] 的预览68=] 使用 Stream<List\<int>>?

我考虑过但不确定如何完成的事情

1- 有没有办法将 Uint8List? 转换为 List<int>?

2- 是否有使用 Uint8List?

发送文件的替代方法

3- 有没有办法从文件选择器结果中同时接收 Uint8List?Stream<List\<int>>?

我在下面复制了一些片段,但如果您需要更多信息,请告诉我。提前感谢您的帮助:)

Flutter 小部件到 Select 文件

Text(
              "Open the File Browser",
              style: TextStyle(
                  color: kPrimaryBlue,
                  fontWeight: FontWeight.bold,
                  fontSize: 20),
            ),
            onPressed: () async {
              try {
                FilePickerResult? result =
                    await FilePicker.platform.pickFiles(
                  type: FileType.any,
                  allowMultiple: true,
                  withReadStream: false,
                  withData: true,
                );

                if (result != null) {
                  for (var file in result.files) {
                    files.add(file);
                  }
                } else {
                  print('No Files Were Selected');
                }
              } catch (ex) {
                print(ex);
              }

向端点发送文件的 HTTP 请求:


var uri = Uri.parse('https://hookb.in/7ZGKQE8ZDOua99D3RwMD'); var request = http.MultipartRequest('POST', uri);

                  for (var file in files) {
                    request.files.add(http.MultipartFile(
                        "files", file.readStream!, file.size!,
                        filename: file.name));
                  }

                  var response = await request.send();
                  if (response.statusCode == 200) {
                    print('Uploaded!');

                    setState(() {
                      files = [];
                    });

提交前要显示 image/file 的小部件:

Image(
            image: Image.memory(files[index].bytes);

If I use the Uint8List? I am able to load the file using the Flutter Image.memory method but I am am unable to use the Uint8List to use the http.MultiPartFile.fromBytes() because it only accepts a List.

这部分不正确。 Uint8List 实现了 List<int> 接口,可以传递给任何需要 List<int> 的 functions/constructors。因此,您可以使用 MultipartFile.fromBytes 构造函数。如果您看到输入错误,可能是因为您没有将可空类型提升为不可空类型。

MultipartFile.fromBytes('files', file.bytes!)