无法在 iOS 13.4 上与 WKWebView 同时处理触摸 [英] Can't handle touches simultaneously with WKWebView on iOS 13.4
问题描述
问题:从 iOS 13.4 开始,WebKit 会拦截之前传递给系统的手势,并且可以由 UIGestureRecognizer
同时处理
Problem:
Starting from iOS 13.4 WebKit intercepts gestures that previously were passed to the system and could be handled by UIGestureRecognizer
simultaneously
演示项目:我创建了 WKWebView
并将其添加到 UIViewController
的视图中.我还创建了 UIPinchGestureRecognizer
并将其添加到 UIViewControler
的视图中.
Demo project:
I created WKWebView
and added it to UIViewController
's view. I created also UIPinchGestureRecognizer
and added it to UIViewControler
's view as well.
class ViewController: UIViewController, UIGestureRecognizerDelegate, WKNavigationDelegate {
var webView: WKWebView?
override func viewDidLoad() {
super.viewDidLoad()
let pinch = UIPinchGestureRecognizer(target: self, action: #selector(self.pinchHandler))
pinch.delegate = self
self.view.addGestureRecognizer(pinch)
addWebView()
}
func addWebView() {
let webView = WKWebView()
webView.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(webView)
NSLayoutConstraint.activate([
webView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
webView.topAnchor.constraint(equalTo: view.topAnchor),
webView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
webView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])
self.webView = webView
}
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
if let localHtmlFile = Bundle.main.url(forResource: "index", withExtension: "html") {
let request = URLRequest(url: localHtmlFile)
webView?.load(request)
}
}
@objc func pinchHandler() {
debugPrint("PinchHandler called")
}
func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldRecognizeSimultaneouslyWith otherGestureRecognizer: UIGestureRecognizer) -> Bool {
return true
}
func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldReceive event: UIEvent) -> Bool {
if event.type == .touches {
return true
}
return false
}
func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldReceive touch: UITouch) -> Bool {
return true
}
}
我尝试运行添加到主包中的示例 html 网站:
I try to run sample html website added to main bundle:
<html>
<head>
<style>
.center {
width: 100%;
height: 100%;
border: 3px solid #73AD21;
text-align: center;
font-size: 100;
overflow: hidden;
}
</style>
<script>
function move(event) {
console.log(event);
event.preventDefault()
}
</script>
</head>
<body ontouchmove="move(event)" class="center">
<p id="content">
demo
</p>
</body
</html>
网站拦截了 touchmove
事件,我在 move(event)
函数中取消了它.
Website intercepts touchmove
event and I'm cancelling it in move(event)
function.
当我在 iOS 13.0 Simulator 上运行此代码 10 次时,每次我的处理程序都有效.当我在 iOS 13.4 Simulator 上运行此代码 10 次时,我的捏合处理程序工作了 4 次,但没有工作 6 次.
When I ran this code 10 times on iOS 13.0 Simulator, every time my handler worked. When I ran this code 10 times on iOS 13.4 Simulator, my pinch handler worked 4 times and didn't work 6 times.
推荐答案
我最终改用 Javascript 来检测 webview 上的点击.一个正在运行的操场展示了如何做到这一点:
I ended up switching to use Javascript to detect the taps on the webview. A running playground showing how to do it:
import UIKit
import PlaygroundSupport
import WebKit
class TouchDetectionOnWKWebViewUsingJSDemoVC : UIViewController, WKScriptMessageHandler {
override func loadView() {
let config = WKWebViewConfiguration()
let webView = WKWebView(frame: .init(origin: .zero, size: .init(width: 100, height: 200)), configuration: config)
let jsEvent = "touchstart"
let handlerName = "handler"
let jsCode =
"""
window.addEventListener('\(jsEvent)', function(e) {
window.webkit.messageHandlers.\(handlerName).postMessage('\(jsEvent)')
})
"""
let jsScript = WKUserScript(source: jsCode, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
config.userContentController.addUserScript(jsScript)
config.userContentController.add(self, name: handlerName)
let demoURL = URL(string: "https://developer.apple.com/")!
webView.load(URLRequest(url: demoURL))
self.view = webView
}
func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
print(message.body)
}
}
PlaygroundPage.current.liveView = TouchDetectionOnWKWebViewUsingJSDemoVC()
在示例中我展示了如何监听 touchstart
事件,但它可以是任何 js 事件,例如:touchend
、touchmove
,gesturestart
、gestureend
等.我们甚至可以监听滚动事件(但我认为最好成为 webView.scrollView
委托).
In the example I show how to listen for touchstart
event, but it can be any js event, e.g.: touchend
, touchmove
, gesturestart
, gestureend
, and others. We can even listen to scroll events (but I think is better to be the webView.scrollView
delegate for that).
这篇关于无法在 iOS 13.4 上与 WKWebView 同时处理触摸的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!