Android：如何将矢量可绘制图像加载到网络视图中？

Question

抱歉，如果这是重复的，但我努力搜索，但没有发现这个问题被问到......

回到过去的 Android 时代，您可以将类似这样的内容添加到 WebView 的源 html 中：

<img src='file:///android_res/drawable/my.png'/>

并且它会在 WebView 中正确显示 my.png。但是 - Android 现在支持（并且更喜欢我们使用）这些新奇的矢量绘图，并且 Android Studio 的Vector Asset Studio使从 SVG 文件或其他文件导入它们变得非常容易。

最棒的是，为了向后兼容，在构建过程中会自动生成各种 dpi/屏幕尺寸的 .png 文件，以支持旧设备。因此，如果您的目标是较旧的设备，则那里有 .png 图像。

如果我能联系到他们就好了。因为，据我所知，使用矢量图形确实会破坏file:///android_res/drawable/ imgWebView 中的这些链接。这很奇怪，因为正如我所说，如果只是查看的话，可以查看 .png 文件。

我想过一些方法来解决这个问题，但没有一个有效：

由于 .png 是动态生成的并包含在 .apk 中，我想也许我可以直接指向生成的文件之一，例如file:///android_res/drawable-hdpi-v4/my.png. （我检查了 .apk 文件，其中之一就在那里......）但是没有这样的运气。破碎的图像。
好吧，我想——也许有一种方法可以让 WebView 直接显示矢量对象。也就是说，WebView 可能会识别一个<img src="file:///android_res/drawable/my_image.xml"/>或类似的东西。我的意思是，Chrome 可以渲染 svg 对吗？也许它也支持 .xml 矢量格式。但这里也没有骰子。（即使它有效，它也不太可能支持旧的 pre-chromium webview 版本。）
我尝试的第三件事是仅包含一个 xxxhdpi 大小的 .png，res/drawable以便 Web 视图能够找到它并希望显示它。不幸的是，这也不起作用。看来只要有一个 .xml 矢量/drawable就足以让它阻止 png，无论它是否在/drawable或/drawable-xxxhdpi目录中。

因此，显而易见的问题是：有没有办法让 WebView 显示矢量 xml（或生成的相关支持 .png）？我们如何在带有矢量绘图的 WebView 中从 HTML 访问绘图？特别是。无需以编程方式执行任何操作？

有人知道这应该如何运作吗？我想接下来要做的就是深入研究 chromium/android 源代码，尝试找出file:///android_res/drawable/工作原理，但这听起来并不有趣，所以如果有人有答案，那将会有所帮助。

我可能在这里遗漏了一些非常明显的东西。提前谢谢！

更新：我尝试/排除的其他事情包括（1）删除图像名称中的下划线（因为我认为它们可能会被替换为“/”），（2）loadDataWithBaseUrl（）中baseurl的各种排列

Answer 1

好吧，四年后，我想出的最佳解决方案就是拥有两个矢量文件 - (1) 应用程序的 xml Android 矢量文件，然后 (2) .svgwebview 格式的相同图像。与提供单独的.png或.gif为每个 dpi 等提供一个解决方案相比，这仍然是一个较小的解决方案。

SVG 和矢量格式在内部非常相似，因此将一种格式转换为另一种格式并不困难。事实上，Android Studio 会将 SVG 转换为 XML。如果你想走另一条路，只需比较几个例子即可。

因此，只需将您的 svgs 放入中assets/svg/，然后您就可以<img src='file:///android_asset/svg/mysvg.svg'/>在 HTML 中使用 webview 进行访问。

仍然存在存储问题。但是 svgs 相对较小（并且您可以缩小 - 即，挖出 SVG 文件中 Web 视图未使用的一些额外内容），因此它并不像替代方案那么糟糕 - 提供大型二进制图像文件该应用程序。