将Base64字符串解码为图像在Flutter中

huangapple go评论85阅读模式
英文:

DECODE BASE64STRING TO IMAGE IN FLUTTER

问题

这是我的代码来显示图片,但最终出现了以下错误:
I/flutter (15439): 格式异常:无效的长度,必须是四的倍数(在字符256处)

有人可以帮助我吗?

英文:

this my code to display image

body: ListView.builder(
      itemCount: jsonList == null ? 0 : jsonList.length,
      itemBuilder: (BuildContext context, int index) {
        return ListTile(
          leading:Image(image: MemoryImage(base64Decode(base64String))),
          trailing: Text(jsonList[index]['pname']
            ,
            style: TextStyle(color: Colors.brown, fontSize: 15),
          ),
          title: Text(jsonList[index]['pdesc']),
        );
      }),

but end up with this error
I/flutter (15439): FormatException: Invalid length, must be multiple of four (at character 256)
I/flutter (15439): ...2vt6b997q855/zhVdW9337r3dgewn+fll6e607fqVJ3z/Z3z209deIfeof+fSfytO1CEBCfeR+0
I/flutter (15439):

anybody please help me?

答案1

得分: 0

The base64String is wrong, try another and it should work for you. I'll send you an example.

import 'dart:convert';
import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    final List jsonList = [
      {"pname": "test", "pdesc": "example"}
    ];

    //String base64String =
    //    "iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAABHNCSVQICAgIfAhkiAAAIABJREFUeJztnXmYHVWd9z/nVN2lt3R30p3urIQkhCSQEMISdjCIEEZREYbNDcdxXubl9cGRxdFBZdwQlRl1RHnAEXVEUV9FUXYxISQhZCH7TrbO2vt6b997q855/zhVdW9337r3dgewn+fll6e607fqVJ3z/Z3z209deIfeof+fSfytO1CEBCfeR+0";
    String base64String =
        "iVBORw0KGgoAAAANSUhEUgAAAB4AAAAdCAYAAAC9pNwMAAAABHNCSVQICAgIfAhkiAAAABl0RVh0U29mdHdhcmUAZ25vbWUtc2NyZWVuc2hvdO8Dvz4AAAAtdEVYdENyZWF0aW9uIFRpbWUAVGh1IDIwIEp1bCAyMDIzIDExOjIxOjMyIEFNIEVEVMnR7tEAAAFMSURBVEiJ7dYhbINAGIbhF9IE3HBD1rVuuMnVtXOVSOS54VaJnETiipxkjrlKUGOuddQxVXC4m1jFko62WSHNsn7qcvfnnuTy3+UUKaXkDFHPgf5TuD6iqHieYio6k7BsDz64VR7iiBc+WiO38P7lJYHj8lq1rAKq0bhUkz05eLXDw53WPqw3sZmH8HW8cIbVVHQK/LOaMHNCjKcQMexABXq7UyUL1yHq+yROH2ivk/fCZezixBZ+YmN2Qn5Fzb5f5CJCiIRREDDtUgVULyq2w5xQCLJJgD9p7vXW4EWcUQN5IJjlNqE/onsWFG08l0Vk4pr3RMYNQ3O3i8tlyqqCq8EtQwMMOyB2rZPgHrqOTk1ZQ7V+J103F1erlBS4tlro9MHjm9yfjZyPNQmaHM83B2qPjzq1Tzuy30b1zuM2v9VdR7l89i7wBf7z8CcwmdC0wpEALQAAAABJRU5ErkJggg==";
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Material App Bar'),
        ),
        body: ListView.builder(
            itemCount: jsonList.length,
            itemBuilder: (BuildContext context, int index) {
              return ListTile(
                leading: Image(image: MemoryImage(base64Decode(base64String))),
                trailing: Text(
                  jsonList[index]['pname'],
                  style: const TextStyle(color: Colors.brown, fontSize: 15),
                ),
                title: Text(jsonList[index]['pdesc']),
              );
            }),
      ),
    );
  }
}
英文:

The base64String is wrong, try another and it should work for you. I'll send you an example.

import 'dart:convert';
import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    final List jsonList = [
      {"pname": "test", "pdesc": "example"}
    ];

    //String base64String =
    //    "iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAABHNCSVQICAgIfAhkiAAAIABJREFUeJztnXmYHVWd9z/nVN2lt3R30p3urIQkhCSQEMISdjCIEEZREYbNDcdxXubl9cGRxdFBZdwQlRl1RHnAEXVEUV9FUXYxISQhZCH7TrbO2vt6b997q855/zhVdW9337r3dgewn+fll6e607fqVJ3z/Z3z209deIfeof+fSfytO1CEBCfeR+0";
    String base64String =
        "iVBORw0KGgoAAAANSUhEUgAAAB4AAAAdCAYAAAC9pNwMAAAABHNCSVQICAgIfAhkiAAAABl0RVh0U29mdHdhcmUAZ25vbWUtc2NyZWVuc2hvdO8Dvz4AAAAtdEVYdENyZWF0aW9uIFRpbWUAVGh1IDIwIEp1bCAyMDIzIDExOjIxOjMyIEFNIEVEVMnR7tEAAAFMSURBVEiJ7dYhbINAGIbhF9IE3HBD1rVuuMnVtXOVSOS54VaJnETiipxkjrlKUGOuddQxVXC4m1jFko62WSHNsn7qcvfnnuTy3+UUKaXkDFHPgf5TuD6iqHieYio6k7BsDz64VR7iiBc+WiO38P7lJYHj8lq1rAKq0bhUkz05eLXDw53WPqw3sZmH8HW8cIbVVHQK/LOaMHNCjKcQMexABXq7UyUL1yHq+yROH2ivk/fCZezixBZ+YmN2Qn5Fzb5f5CJCiIRREDDtUgVULyq2w5xQCLJJgD9p7vXW4EWcUQN5IJjlNqE/onsWFG08l0Vk4pr3RMYNQ3O3i8tlyqqCq8EtQwMMOyB2rZPgHrqOTk1ZQ7V+J103F1erlBS4tlro9MHjm9yfjZyPNQmaHM83B2qPjzq1Tzuy30b1zuM2v9VdR7l89i7wBf7z8CcwmdC0wpEALQAAAABJRU5ErkJggg==";
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Material App Bar'),
        ),
        body: ListView.builder(
            itemCount: jsonList.length,
            itemBuilder: (BuildContext context, int index) {
              return ListTile(
                leading: Image(image: MemoryImage(base64Decode(base64String))),
                trailing: Text(
                  jsonList[index]['pname'],
                  style: const TextStyle(color: Colors.brown, fontSize: 15),
                ),
                title: Text(jsonList[index]['pdesc']),
              );
            }),
      ),
    );
  }
}

huangapple
  • 本文由 发表于 2023年7月20日 22:40:29
  • 转载请务必保留本文链接:https://go.coder-hub.com/76731023.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定