背景含WebView时SwiftUI dropDestination的targeted无法设为false

问题根源 #

WKWebView默认自带拖放交互能力，会与SwiftUI的dropDestination事件产生抢占；同时withAnimation和嵌套frame的组合，会在快速拖拽时导致布局更新延迟，使得拖放目标的命中检测失效，最终isDragOver无法正确重置为false。

修复/规避方法 #

1. 禁用WebView的拖放交互（推荐，不影响WebView其他交互）

通过自定义WKNavigationDelegate拦截WebView的拖放事件，让SwiftUI的拖放目标优先响应：

struct WebView: UIViewRepresentable {
    class Coordinator: NSObject, WKNavigationDelegate {
        // 拒绝WebView处理拖放事件
        func webView(_ webView: WKWebView, performDropWith dropSession: UIDropSession) -> Bool {
            return false
        }
    }

    func makeCoordinator() -> Coordinator {
        Coordinator()
    }

    func makeUIView(context: Context) -> WKWebView {
        let webView = WKWebView()
        webView.configuration.allowsInlineMediaPlayback = true
        webView.navigationDelegate = context.coordinator
        if let requestUrl = URL(string: "https://www.youtube.com") {
            webView.load(URLRequest(url: requestUrl))
        }
        return webView
    }

    func updateUIView(_ uiView: WKWebView, context: Context) {}
}

2. 调整视图结构，固定拖放目标的命中区域

改用overlay实现圆形放大效果，同时保持拖放目标的可交互区域固定，避免嵌套frame导致的命中检测混乱：

struct TestView: View {
    @State var isDragOver = false
    let size = 20.0

    var body: some View {
        // 固定大小的透明视图作为拖放目标，确保命中区域不变
        Color.clear
            .frame(width: size, height: size)
            .dropDestination(for: URL.self) { _, _ in
                return true
            } isTargeted: { targeted in
                withAnimation {
                    isDragOver = targeted
                }
            }
            // 叠加圆形视图，仅负责视觉显示，不接收交互
            .overlay(
                Circle()
                    .fill(.black)
                    .frame(
                        width: isDragOver ? 6 * size : 2 * size,
                        height: isDragOver ? 6 * size : 2 * size
                    )
                    .allowsHitTesting(false)
            )
    }
}

3. 移除动画修饰符（简单快捷）

如果不需要平滑的放大动画，直接去掉withAnimation，避免布局更新延迟影响拖放事件响应：

.dropDestination(for: URL.self) { _, _ in
    return true
} isTargeted: { targeted in
    isDragOver = targeted // 移除withAnimation修饰符
}

4. 改用UIKit拖放API替代SwiftUI实现

当SwiftUI拖放与UIKit视图兼容性问题无法解决时，直接使用UIKit的UIDropInteraction实现拖放目标，确保事件响应可靠：

struct TestView: UIViewRepresentable {
    @State var isDragOver = false
    let size = 20.0

    class DropTargetView: UIView {
        var isDragOver = false {
            didSet { setNeedsDisplay() }
        }
        var onTargetedChange: ((Bool) -> Void)?

        override init(frame: CGRect) {
            super.init(frame: frame)
            addInteraction(UIDropInteraction(delegate: DropDelegate(view: self)))
            backgroundColor = .clear
        }

        required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") }

        // 手动绘制圆形，控制放大效果
        override func draw(_ rect: CGRect) {
            super.draw(rect)
            let circleSize = isDragOver ? 6 * size : 2 * size
            let circleRect = CGRect(
                x: (bounds.width - circleSize)/2,
                y: (bounds.height - circleSize)/2,
                width: circleSize,
                height: circleSize
            )
            UIColor.black.setFill()
            UIBezierPath(ovalIn: circleRect).fill()
        }
    }

    class DropDelegate: NSObject, UIDropInteractionDelegate {
        weak var view: DropTargetView?

        init(view: DropTargetView) {
            self.view = view
            super.init()
        }

        func dropInteraction(_ interaction: UIDropInteraction, sessionDidEnter session: UIDropSession) {
            view?.isDragOver = true
            view?.onTargetedChange?(true)
            UIView.animate(withDuration: 0.2) { self.view?.setNeedsDisplay() }
        }

        func dropInteraction(_ interaction: UIDropInteraction, sessionDidExit session: UIDropSession) {
            view?.isDragOver = false
            view?.onTargetedChange?(false)
            UIView.animate(withDuration: 0.2) { self.view?.setNeedsDisplay() }
        }

        func dropInteraction(_ interaction: UIDropInteraction, canHandle session: UIDropSession) -> Bool {
            return session.hasItemsConforming(toTypeIdentifiers: [kUTTypeFileURL as String])
        }

        func dropInteraction(_ interaction: UIDropInteraction, performDrop session: UIDropSession) {
            // 处理拖放逻辑
        }
    }

    func makeUIView(context: Context) -> DropTargetView {
        let view = DropTargetView(frame: CGRect(x: 0, y: 0, width: size, height: size))
        view.onTargetedChange = { self.isDragOver = $0 }
        return view
    }

    func updateUIView(_ uiView: DropTargetView, context: Context) {
        uiView.isDragOver = isDragOver
    }
}

内容的提问来源于stack exchange，提问作者fer0n