本地 flutter 资源图像未显示在 html 小部件中

Question

我正在使用 flutter_html 渲染 html 代码，它运行良好，但我遇到了 img 标签的问题

当图像来自网络时，img 标签可以很好地工作，如下所示：

<img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png">

但当它是本地资产图像文件时它不起作用注意：我可以在图像小部件中使用相同的图像，如下所示：

Image.asset('assets/images/logo_tst.png'),

但它不会显示在 html 代码中，我尝试了所有这些：

String htmlUrl = '''  
<img src="file:///storage/assets/images/logo_tst.png" alt="web-img1" >
<img src="file:///assets/images/logo_tst.png" alt="web-img2">
<img src="file:///images/logo_tst.png" alt="web-img3">
''';

然后我称之为：

Html( data:htmlUrl),

它只显示 alt：

web-img1
web-img2
web-img3

我正在 Android 模拟器和设备上进行测试

我究竟做错了什么？

谢谢

Answer 1

我做到了！我找到了一个解决方案，但它并不明显，也没有记录在任何地方！

在搜索了几天使用带有 img 标签的资源的正确方法之后，我决定查看 github 中 flutter_html 的源代码，我发现了这两行：

else if (node.attributes['src'].startsWith('asset:')) {
                  final assetPath = node.attributes['src'].replaceFirst('asset:', '');

所以我尝试了这样的 img 标签：

<img src="asset:assets/images/logo_tst.png" alt="web-img2">

顺便说一句，我的图像文件被声明pubspec.yaml为

assets/images/logo_tst.png

它起作用了！

正如我所说，没有关于此的文档，我希望有人能添加它