Question

照片是用Flutter软件包image_picker拍摄的，并保存为“文件”类型的变量。可以使用Flutter查看这些图像。从jSON字符串中，应将BASE64格式的照片格式化为该数据类型，以便能够显示它们。有人知道这是怎么回事吗？

可以使用Flutter直接显示BASE64图像。问题在于，渲染时会出现“闪烁”效果，因为每次用户键入时都会重新加载照片。该框架似乎在BASE64图像中似乎没有注意到它始终是同一张照片。对于文件类型的照片，不会发生此问题。

因此，我不建议直接渲染BASE64字符串。所以我想应用转换。

有人能解决如何将BASE64字符串转换为“文件”类型的变量吗？

    var picturesTaken = <File>[];

    Widget _showFoto(int currentFoto) {
      return Padding(
          padding: const EdgeInsets.only(bottom: 10.0),
          child: Container(
            child: Padding(
              padding: const EdgeInsets.all(20.0),
              child: Center(
                child: Column(
                  children: <Widget>[
                    Image.file(picturesTaken[currentFoto])
                  ],
                ),
              ),
            ),
          )
      );
    }

Answer 1

您的base64字符串不应在前缀中包含部分'data:image/jpg;base64,'等

List<int> imageBytes = _image.readAsBytesSync();
String imageB64 = base64Encode(imageBytes);

要在用户界面中显示

Image.memory(
   img,
   width: 85,
   height: 85,
   fit: BoxFit.cover,
)

Answer 2

根据您的回答，我找到了解决方法：

    Image.memory(
      img,
      width: 85,
      height: 85,
      fit: BoxFit.cover,
      gaplessPlayback: true
    )

Answer 3

import 'dart:convert';
import 'dart:typed_data';

String _base64;   
Uint8List bytes = BASE64.decode(_base64);
Image.memory(bytes)

（或）

Image imageFromBase64String(String base64String) {
 return Image.memory(base64Decode(base64String));
}

Uint8List dataFromBase64String(String base64String) {
 return base64Decode(base64String);
}

String base64String(Uint8List data) {
 return base64Encode(data);
}

使用 'dart:convert' 包有一种更简单的方法

  Image.memory(base64Decode(base64String));

Flutter：将Base64字符串转换为图像（类型文件变量）

3 个答案: