在 WKWebView 之上覆盖 PKCanvasView

编程问答 2022-05-25

问题描述

我正在尝试将 Apple Pencil 与 WKWebView 集成。

期望的行为：

  • 使用铅笔，您可以在网页上通过所有花哨的 Pencilkit 集成（PKToolPicker 等）在网页上绘图
  • 使用手指可以滚动浏览网页，并且滚动会同步到 webview。

采取 2

所以在花了更多时间解决这个问题之后，我找到了一个非常笨拙的解决方案，我实际上并不喜欢这个解决方案：

  • 在它上面创建一个 WKWebView 和一个透明的 PKCanvasView。
  • 覆盖 `PKCanvasView 的 hitTest 以始终返回 nil。
  • 将 PKCanvasView 的 drawingGestureRecognizer 添加到 WKWebView
  • 确保为 drawingGestureRecognizer.allowedTouchTypes = [NSNumber(value: UITouch.TouchType.pencil.rawValue)] 设置了 PKCanvasView

这种方法有效，但它消除了实现的大量灵活性。

采取 1

到目前为止，我尝试了两种方法：

  • 当我检测到来自手指的输入时，有选择地取消画布上的用户输入。这不起作用，因为在事件被视图消耗之前我无法检测到这一点。

  • 创建一个透明的超级视图，并在我进行检测时为 PKCanvasView 和 WKWebView 手动调用 touchesBegan/touchesMoved/touchesEnded。不幸的是，这也不起作用，因为调用这些方法没有任何作用。

这是我到目前为止的一些基本代码：

struct SUICanvasView: UIViewControllerRepresentable {
    let url: URL?
    func makeUIViewController(context: Context) -> ZRCanvasReader {
        let canvasReader = ZRCanvasReader()
        canvasReader.openUrl(url: url)
        return canvasReader
    }

    func updateUIViewController(_ uiViewController: ZRCanvasReader,context: Context) {

    }

    typealias UIViewControllerType = ZRCanvasReader
}

class ZRCanvasReader: UIViewController {
    lazy var canvas: PKCanvasView = {
        let v = PKCanvasView()
        v.isOpaque = false
        v.backgroundColor = .clear
        return v
    }()

    lazy var toolPicker: PKToolPicker = {
        let toolPicker = PKToolPicker()
        return toolPicker
    }()

    lazy var webView: WKWebView = {
        let prefs = WKWebpagePreferences()
        prefs.allowsContentJavaScript = true

        let config = WKWebViewConfiguration()
        config.defaultWebpagePreferences = prefs


        let webview = WKWebView(frame: .zero,configuration: config)
        return webview
    }()

    override func viewDidLoad() {
        super.viewDidLoad()
        view.addSubview(webView)
        view.addSubview(canvas)

        webView.frame = view.frame
        canvas.frame = view.frame

        toolPicker.addobserver(canvas)
        toolPicker.setVisible(true,forFirstResponder: canvas)
    }

    func openUrl(url: URL?) {
        guard let loadingUrl = url else {
            return
        }
        let request = URLRequest(url: loadingUrl)
        webView.load(request)
    }
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

iosiospencilkitswiftswiftswiftswiftuikituikituikitwebkitwebkitwebkit