[英]How to display a dart:html file image in Flutter web?
I upload a file from the users device this way:我通过这种方式从用户设备上传文件:
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
});
},
);
},
);
}
}
I would like to display this image.我想显示此图像。 I tried using an Image.file:我尝试使用 Image.file:
Container(
width: 100,
height: 100,
child: Image.file(
image,
fit: BoxFit.contain,
),
),
However this gives me this error:但是,这给了我这个错误:
The argument type 'File (where File is defined in C:\\Users\\Asus\\Documents\\flutter\\bin\\cache\\pkg\\sky_engine\\lib\\html\\html_dart2js.dart)' can't be assigned to the parameter type 'File (where File is defined in C:\\Users\\Asus\\Documents\\flutter\\bin\\cache\\pkg\\sky_engine\\lib\\io\\file.dart)'.dartargument_type_not_assignable html_dart2js.dart(15975, 7): File is defined in C:\\Users\\Asus\\Documents\\flutter\\bin\\cache\\pkg\\sky_engine\\lib\\html\\html_dart2js.dart file.dart(241, 16): File is defined in C:\\Users\\Asus\\Documents\\flutter\\bin\\cache\\pkg\\sky_engine\\lib\\io\\file.dart Peek Problem (Alt+F8) No quick fixes available参数类型“文件(其中文件在 C:\\Users\\Asus\\Documents\\flutter\\bin\\cache\\pkg\\sky_engine\\lib\\html\\html_dart2js.dart 中定义)”不能分配给参数类型“文件” (其中文件在 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 Peek 问题 (Alt+F8) 没有可用的快速修复
Is there a way to convert a dart:html File into a dart:io File? 有没有办法将 dart:html 文件转换为 dart:io 文件? Or should I try another way of displaying the image? 或者我应该尝试另一种显示图像的方式? In that case how do I display a dart:html File? 在这种情况下,如何显示 dart:html 文件?Thanks for your help in advance!提前感谢您的帮助!
One solution is to use the image_whisperer package.一种解决方案是使用image_whisperer包。
Lets say that your html.File
is variable myfile
, The following works for me:假设您的html.File
是变量myfile
,以下对我html.File
:
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
...
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.