如果你的项目有 dart html 导入,如何 运行 在模拟器上 flutter
How to run flutter on the emulator if you project has dart html imports
我正在为移动和网络应用程序使用 flutter。我需要从移动应用程序和网络浏览器上传照片。移动应用程序没有问题,一切正常,对于网络版本,发明了以下解决方案:我为网络应用程序创建了一个方法,以便可以从桌面上传照片。为此,我使用了 import 'dart:html';
,但如果我尝试 运行 在网络浏览器中一切正常,但如果我现在在移动应用程序上 运行,我会收到一堆错误提示无法编译 Web 导入 (html)。
我阅读了以下问题,其中说您根本无法在移动应用程序中调用 HTML 方法。如果应用程序不在 Web 浏览器中 运行,我禁止调用 HTML 方法,但结果相同:
import 'dart:html';
Future<void> _listenImagesFromWeb() async {
if (!kIsWeb)
return;
final String profileId = (await FirebaseAuth.instance.currentUser()).uid;
final completer = Completer<List<String>>();
InputElement uploadInput = FileUploadInputElement();
uploadInput.multiple = true;
uploadInput.accept = 'image/*';
uploadInput.click();
uploadInput.addEventListener('change', (e) async {
final files = uploadInput.files;
Iterable<Future<String>> resultsFutures = files.map((file) {
final reader = FileReader();
reader.readAsDataUrl(file);
reader.onError.listen((error) => completer.completeError(error));
return reader.onLoad.first.then((_) => reader.result as String);
});
final results = await Future.wait(resultsFutures);
completer.complete(results);
});
//* need to append on mobile safari
document.body.append(uploadInput);
final List<String> images = await completer.future;
this.setState(() {
_isLoading = true;
});
await addFilesToStorage(widget.agreement.id, images, profileId);
uploadInput.remove();
}
await _listenImagesFromWeb().then((value) =>
setState(() {
images = loadImage();
})
);
updateState();
}
floatingActionButton: kIsWeb
? SpeedDial(
animatedIconTheme: IconThemeData(size: 22.0),
child: Icon(Icons.add),
closeManually: false,
children: [
SpeedDialChild(
child: Icon(Icons.photo_library),
label: translate('agreement.image_uploader.select_images_button', context: context),
onTap: () => _callAddImagesFromWeb(context)),
],
)
: SpeedDial(
animatedIconTheme: IconThemeData(size: 22.0),
child: Icon(Icons.add),
closeManually: false,
children: [
SpeedDialChild(
child: Icon(Icons.camera_alt),
label: translate('agreement.image_uploader.take_picture_button', context: context),
onTap: () => _addMultiplyFile(context, true)),
SpeedDialChild(
child: Icon(Icons.photo_library),
label: translate('agreement.image_uploader.select_images_button', context: context),
onTap: () => _addMultiplyFile(context, false)),
],
),
错误:未找到:'dart:html'
我会使用这个不错的项目 [https://pub.dev/packages/universal_html],如果您按照他们的说明进行操作,它可以满足您的需求:
Just replace dart:html imports with package:universal_html/html.dart.
In browsers, dart:html will be automatically used.
并且它将确保代码在 Web 和移动目标上都能编译。如果是网络,它将自动导入 dart:html,如果是移动设备,它将提供虚拟功能。
我正在为移动和网络应用程序使用 flutter。我需要从移动应用程序和网络浏览器上传照片。移动应用程序没有问题,一切正常,对于网络版本,发明了以下解决方案:我为网络应用程序创建了一个方法,以便可以从桌面上传照片。为此,我使用了 import 'dart:html';
,但如果我尝试 运行 在网络浏览器中一切正常,但如果我现在在移动应用程序上 运行,我会收到一堆错误提示无法编译 Web 导入 (html)。
我阅读了以下问题,其中说您根本无法在移动应用程序中调用 HTML 方法。如果应用程序不在 Web 浏览器中 运行,我禁止调用 HTML 方法,但结果相同:
import 'dart:html';
Future<void> _listenImagesFromWeb() async {
if (!kIsWeb)
return;
final String profileId = (await FirebaseAuth.instance.currentUser()).uid;
final completer = Completer<List<String>>();
InputElement uploadInput = FileUploadInputElement();
uploadInput.multiple = true;
uploadInput.accept = 'image/*';
uploadInput.click();
uploadInput.addEventListener('change', (e) async {
final files = uploadInput.files;
Iterable<Future<String>> resultsFutures = files.map((file) {
final reader = FileReader();
reader.readAsDataUrl(file);
reader.onError.listen((error) => completer.completeError(error));
return reader.onLoad.first.then((_) => reader.result as String);
});
final results = await Future.wait(resultsFutures);
completer.complete(results);
});
//* need to append on mobile safari
document.body.append(uploadInput);
final List<String> images = await completer.future;
this.setState(() {
_isLoading = true;
});
await addFilesToStorage(widget.agreement.id, images, profileId);
uploadInput.remove();
}
await _listenImagesFromWeb().then((value) =>
setState(() {
images = loadImage();
})
);
updateState();
}
floatingActionButton: kIsWeb
? SpeedDial(
animatedIconTheme: IconThemeData(size: 22.0),
child: Icon(Icons.add),
closeManually: false,
children: [
SpeedDialChild(
child: Icon(Icons.photo_library),
label: translate('agreement.image_uploader.select_images_button', context: context),
onTap: () => _callAddImagesFromWeb(context)),
],
)
: SpeedDial(
animatedIconTheme: IconThemeData(size: 22.0),
child: Icon(Icons.add),
closeManually: false,
children: [
SpeedDialChild(
child: Icon(Icons.camera_alt),
label: translate('agreement.image_uploader.take_picture_button', context: context),
onTap: () => _addMultiplyFile(context, true)),
SpeedDialChild(
child: Icon(Icons.photo_library),
label: translate('agreement.image_uploader.select_images_button', context: context),
onTap: () => _addMultiplyFile(context, false)),
],
),
错误:未找到:'dart:html'
我会使用这个不错的项目 [https://pub.dev/packages/universal_html],如果您按照他们的说明进行操作,它可以满足您的需求:
Just replace dart:html imports with package:universal_html/html.dart. In browsers, dart:html will be automatically used.
并且它将确保代码在 Web 和移动目标上都能编译。如果是网络,它将自动导入 dart:html,如果是移动设备,它将提供虚拟功能。