Flutter：如何将base64转为图片？

Question

我发送了 JSON 格式的消息，我可以将数据显示为 Base64，但我不知道如何将其转换为图像并显示。


class _ShowformState extends State<Showform> {
  List data;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Maintenancce Information", style: TextStyle(fontSize: 13)),),
      body: _buildListView(),);}
  Widget _buildListView() {
    return ListView.builder(
        itemCount: data == null ? 0 : data.length,
        itemBuilder: (context, index) {
          return _buildColumnInfo(data[index]);
        }); }
  @override
  void initState() {
    super.initState();
    this.getJSONData();}

Future<String> getJSONData() async {
    var url = "http://192.168.1.35:7000/";
    var response = await http.get(url);
    if (response.statusCode == 200) {
      var jsonResponse = json.decode(utf8.decode(response.bodyBytes));
      setState(() {
        data = jsonResponse['data'];});
      var itemCount = jsonResponse['totalItems'];}

  Widget _buildColumnInfo(item) {
    return new Container(
            padding: new EdgeInsets.all(12.0),
            child: new Column(
              children: <Widget>[
                Text("Data Inserted : ${item['photoBase64']}"),], ),)}}

需要用什么方法解码？

Answer 1

不能直接将base64转为Image，但可以显示如下图。

Uint8List bytes= base64.decode("${item['photoBase64']}");

在UI

Image.memory(
        bytes,
        fit: BoxFit.cover,
   );

Answer 2

您可以试试这个代码：

Uint8List convertBase64Image(String base64String) {
  return Base64Decoder().convert(base64String.split(',').last);
}

并添加到您的 UI:

Image.memory(
  convertBase64Image(item['photoBase64']),
  gaplessPlayback: true,
)

Answer 3

下面的简单代码用于将 base64 转换为图像：

Image.memory(base64.decode(base64String.split(',').last))

Flutter：如何将base64转为图片？

Flutter: How to convert base64 to image?

base64

flutter