UIWebView 中的资产目录图像

Question

Xcode 9 在 iOS 项目中使用矢量又向前迈进了一步。它显然会保留源 PDF，以便可以根据需要以完整质量生成图像。

我想知道是否可以从 UIWebView 内的 HTML 访问这些图像？

我可以想象三种可能的方法：

1. 您在 HTML 或 CSS 中放置的一些魔法将被 iOS 识别和替换。例如：

   <img src={{Asset Name}}>

2. 了解获取资产的命名方案。例如：

   <img src="some/path/asset~ipad@3x">

3. 将图像“渲染”到UIWebView之外并传入。

这些有可能吗？还有其他方法吗？

考虑到我们在矢量方面已经走了多远，如果不需要的话，我不希望必须预渲染每个图像变体并将它们打包到资产目录之外。

Answer 1

今天我需要将 XCAsset's 中的 UIImage 渲染成 UIWebView。

我的要求是准备好合适的HTML，并将其加载到UIWebView中，如下所示

self.myWebView.loadHTMLString(html, baseURL: nil)

为了从XCAsset的加载图像，首先将图像加载到UIImage，然后将其转换回Base64 Encoding，然后将图像放入<img>标签。

代码如下所示

let redClockImage = UIImage.init(named: "clock-red")!
let imageData:Data =  UIImagePNGRepresentation(self)!
let base64String = imageData.base64EncodedString()

let html = """
           //my html
           <img src="data:image/png;base64, \(base64String)" />
           //rest of my html
           """

//then i load this html into the webview
self.myWebView.loadHTMLString(html, baseURL: nil)

为方便起见，我将UIImage -> Base64 String 转换为an extension。