图像选择器颤动幅面1.9 [英] Image picker flutter web 1.9
本文介绍了图像选择器颤动幅面1.9的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
在新的Flutter Web 1.9上寻找图像选择器.我找到了一种方法,但不到1.9,现在合并了,不知道我怎么能做到这一点.尝试使用dart:html,但无法发布!仅在运行
Looking for image picker on new flutter web 1.9. I found a way but for less than 1.9, now that is merged dont know how can i achived this. Tried with dart:html but is not working on release! Only on running
推荐答案
似乎与Flutter web 1.10 dev
一样, universal_html包是dart:html
临时空缺职位的理想人选:
It seems like as for Flutter web 1.10 dev
, universal_html package is good candidate for the temporarily vacant position of dart:html
:
import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:universal_html/prefer_universal/html.dart' as html;
class ImagePickerLabPage extends StatefulWidget {
@override
_ImagePickerLabPageState createState() => _ImagePickerLabPageState();
}
class _ImagePickerLabPageState extends State<ImagePickerLabPage> {
String name = '';
String error;
Uint8List data;
pickImage() {
final html.InputElement input = html.document.createElement('input');
input
..type = 'file'
..accept = 'image/*';
input.onChange.listen((e) {
if (input.files.isEmpty) return;
final reader = html.FileReader();
reader.readAsDataUrl(input.files[0]);
reader.onError.listen((err) => setState(() {
error = err.toString();
}));
reader.onLoad.first.then((res) {
final encoded = reader.result as String;
// remove data:image/*;base64 preambule
final stripped =
encoded.replaceFirst(RegExp(r'data:image/[^;]+;base64,'), '');
setState(() {
name = input.files[0].name;
data = base64.decode(stripped);
error = null;
});
});
});
input.click();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(name),
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.open_in_browser),
onPressed: () {
pickImage();
},
),
body: Center(
child: error != null
? Text(error)
: data != null ? Image.memory(data) : Text('No data...'),
),
);
}
}
这篇关于图像选择器颤动幅面1.9的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文