list 如何使用 Flutter 将 BASE64 字符串转换为图像？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/46145472/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to convert BASE64 string into Image with Flutter?
提问by Charles Jr
I'm converting images saved in my Firebase database to Base64 and would like to decode and encode. I've researched similar questions, but am still getting errors. Here is what I have so far?
我正在将保存在 Firebase 数据库中的图像转换为 Base64，并希望进行解码和编码。我研究过类似的问题，但仍然出现错误。这是我到目前为止所拥有的？
var image1 = String;
var pic = event.snapshot.value['image'];
var photo = BASE64.decode(pic);
image1 = photo;
I'm getting the following error...
我收到以下错误...
A value of type "List<int>" cannot be assigned to a variable of type "Type"
A value of type "List<int>" cannot be assigned to a variable of type "Type"
If you could please provide a reverse process for encoding an image into Base64 so they may be saved back to Firebase, that would be appreciated.
如果您可以提供将图像编码为 Base64 的反向过程，以便将它们保存回 Firebase，我们将不胜感激。
*** UPDATE
*** 更新
Here is my updated code that's still throwing an error.
这是我更新的代码，它仍然抛出错误。
image1 = event.snapshot.value['image'];
var image = BASE64.decode(image1.toString());
new Image.memory(image),
The error is...
错误是...
FormatException: Invalid Length must be a multiple of 4
FormatException: Invalid Length must be a multiple of 4
采纳答案by Collin Hymanson
You can convert a Uint8Listto a Flutter Imagewidget using the Image.memoryconstructor. (Use the Uint8List.fromListconstructor to convert a Listto Uint8Listif necessary.) You can use BASE64.encodeto go the other way.
您可以使用构造函数将 a 转换Uint8List为 FlutterImage小部件Image.memory。（使用Uint8List.fromList构造函数的转换List到Uint8List如果需要的话）。你可以用BASE64.encode走另一条路。
Here's some sample code.
这是一些示例代码。
import 'dart:async';
import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
theme: new ThemeData.dark(),
home: new MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
State createState() => new MyHomePageState();
}
class MyHomePageState extends State<MyHomePage> {
String _base64;
@override
void initState() {
super.initState();
(() async {
http.Response response = await http.get(
'https://flutter.io/images/flutter-mark-square-100.png',
);
if (mounted) {
setState(() {
_base64 = BASE64.encode(response.bodyBytes);
});
}
})();
}
@override
Widget build(BuildContext context) {
if (_base64 == null)
return new Container();
Uint8List bytes = BASE64.decode(_base64);
return new Scaffold(
appBar: new AppBar(title: new Text('Example App')),
body: new ListTile(
leading: new Image.memory(bytes),
title: new Text(_base64),
),
);
}
}
However, it's generally a bad idea to store large blobs of binary data in your database. It's not playing to the strengths of Firebase realtime database and you will end up wasting bandwidth transmitting data you don't need as well as unnecessary encoding and decoding. You should use the firebase_storageplugin instead, storing the path or download URL of the image in the database.
但是，在数据库中存储大量二进制数据通常是一个坏主意。它没有发挥 Firebase 实时数据库的优势，您最终会浪费带宽传输不需要的数据以及不必要的编码和解码。您应该改用该firebase_storage插件，将图像的路径或下载 URL 存储在数据库中。
回答by Amir.n3t
There's a simpler way using 'dart:convert'package
有一种更简单的方法使用'dart:convert'包
Image.memory(base64Decode(base64String));
Implementation and some useful methods :
实现和一些有用的方法：
import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/widgets.dart';
Image imageFromBase64String(String base64String) {
return Image.memory(base64Decode(base64String));
}
Uint8List dataFromBase64String(String base64String) {
return base64Decode(base64String);
}
String base64String(Uint8List data) {
return base64Encode(data);
}
回答by Jeferson Rivera
Uint8List _bytesImage;
String _imgString = 'iVBORw0KGgoAAAANSUhEUg.....';
_bytesImage = Base64Decoder().convert(_imgString);
Image.memory(_bytesImage)
回答by Luís De Marchi
To open a camera photo (temporary folder), editing a file and then turning it into Base64:
要打开相机照片（临时文件夹），编辑文件然后将其转换为 Base64：
Code:
代码：
import 'dart:convert';
import 'package:image/image.dart' as ImageProcess;
File file = File(imagePath);
final _imageFile = ImageProcess.decodeImage(
file.readAsBytesSync(),
);
...edit file...
String base64Image = base64Encode(ImageProcess.encodePng(_imageFile));
Decode and show:
解码并显示：
import 'dart:convert';
import 'package:image/image.dart' as ImageProcess;
final _byteImage = Base64Decoder().convert(base64Image);
Widget image = Image.memory(_byteImage)
