Webview rendering, Swift



我试图在我的web视图中呈现不同的HTML。为了给你一个参考,我想把html渲染成一个电子邮件客户端(html在屏幕上完美地调整大小)。

这是我的代码:

func makeUIView(context: Context) -> WKWebView {
var jsScript = "var meta = document.createElement('meta');"
jsScript += "meta.name='viewport';"
jsScript += "meta.content='width=device-width';"
jsScript += "document.getElementsByTagName('head')[0].appendChild(meta);"
let userScript = WKUserScript(source: jsScript, injectionTime: .atDocumentEnd, forMainFrameOnly: true)
let wkController = WKUserContentController()
wkController.addUserScript(userScript)
let wkWebConfiguration = WKWebViewConfiguration()
wkWebConfiguration.userContentController = wkController
let webView = WKWebView(frame: .zero, configuration: wkWebConfiguration)
webView.translatesAutoresizingMaskIntoConstraints = false
if let htmlBody = htmlBody {
webView.loadHTMLString(htmlBody, baseURL: nil)
}
webView.translatesAutoresizingMaskIntoConstraints = false
webView.navigationDelegate = context.coordinator
webView.scrollView.isScrollEnabled = false
return webView
}

这工作得很好,但有时我有一些html渲染得非常小。我在调查过程中发现了两种情况:

问题1 =>有时html文本很长,所以网页视图适应这个长度,结果是所有内容都变小了。如果我能够打破长行,我认为html应该渲染良好。

问题2 =>一些html(少量)是用一些额外的空白空间渲染的,即使我注入了渲染全屏的可能性。因此,文本比较小。

我将此渲染与(例如)Gmail的电子邮件进行比较,其中html在屏幕上是完美的。

这不是IOS或WebView的问题,当涉及到不能应用的CSS时,像客户端这样的电子邮件总是很痛苦。要获得更好的渲染效果,你不需要在WebView上做任何事情,但请查看这篇文章

在邮件客户端中,CSS的工作方式与在普通渲染浏览器或移动浏览器上的工作方式不同,一些CSS样式根本不支持。

同时,这部分代码将调整WebView以适应你的内容,从而导致更小的元素

webView.scrollView.isScrollEnabled = false

最新更新