local flutter asset image not showing in html widget
I did it! I have found a solution and it wasn't obvious and not documented anywhere!
after searching for days the right way to use assets with the img tag I have decided to take a look at the source code of flutter_html in github and I have found these two lines:
else if (node.attributes['src'].startsWith('asset:')) { final assetPath = node.attributes['src'].replaceFirst('asset:', '');so I tried the img tag like this:
<img src="asset:assets/images/logo_tst.png" alt="web-img2">By the way my image file is declared in pubspec.yaml as
assets/images/logo_tst.pngAnd It worked !!!
As I said there is no documentation about this and I hope that someone will add it
Seems like the webview_flutter cannot read local CSS or local images(jpg/png file) by now. I have to change it to inline CSS and based64 images and it works perfectly.
Inline CSS:
<head><style>body { background-color: linen;}h1 { color: maroon; margin-left: 40px;}</style></head>Inline base64 images:
<img src="data:image/jpeg;base64,/9j/4RiDRXhpZgAATU0AKgA...">To convert an image to base64 image in Mac, you can run the following command in Terminal.
openssl enc -base64 -in image.png -out image.b64