我通过以下方式从用户设备上传文件:
void uploadImage() async {
html.InputElement uploadInput = html.FileUploadInputElement();
uploadInput.click();
uploadInput.onChange.listen(
(changeEvent) {
final file = uploadInput.files.first;
final reader = html.FileReader();
reader.readAsDataUrl(file);
reader.onLoadEnd.listen(
(loadEndEvent) async {
setState(() {
image = file; //image is a dart:html File object, it's a field of my statefulwidget
});
},
);
},
);
}
}
我想显示这张图片。我尝试使用 Image.file:
Container(
width: 100,
height: 100,
child: Image.file(
image,
fit: BoxFit.contain,
),
),
但是这给了我这个错误:
参数类型“文件(其中文件在 C:\Users\Asus\Documents\flutter\bin\cache\pkg\sky_engine\lib\html\html_dart2js.dart 中定义)”无法分配给参数类型"file" (其中文件在 C:\Users\Asus\Documents\flutter\bin\cache\pkg\sky_engine\lib\io\file.dart 中定义)'.dartargument_type_not_assignable html_dart2js.dart(15975, 7): 文件定义在 C:\Users\Asus\Documents\flutter\bin\cache\pkg\sky_engine\lib\html\html_dart2js.dart file.dart(241, 16): 文件定义在 C:\Users\Asus\Documents\flutter\bin\cache\pkg\sky_engine\lib\io\file.dart 查看问题 (Alt+F8) 没有可用的快速修复方法
有没有办法将 dart:html 文件转换为 dart:io 文件?或者我应该尝试另一种显示图像的方式?在这种情况下,如何显示 dart:html 文件?提前感谢您的帮助!
最佳答案
一种解决方案是使用 image_whisperer包。
假设您的 html.File
是变量 myfile
,以下内容对我有用:
import 'package:flutter/painting.dart'; // NetworkImage
import 'package:image_whisperer/image_whisperer.dart'; // BlobImage
...
BlobImage blobImage = new BlobImage(myfile, name: myfile.name);
final image = NetworkImage(blobImage.url);
// Use image here
...
关于html - 如何显示 Dart :html file image in Flutter web?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63612781/