Detect tap on a transformed CAShapeLayer’s path

Question

I’ve got multiple CAShapeLayers on a view and all of them can be transformed using CATransform3D.

I’ve found a way to accurately detect taps that are on or inside the paths of these layers but it works only if the layers aren’t transformed.

How can I make this work properly in all situations?

@objc private func userTapped(recognizer: UITapGestureRecognizer) {
        let tapLocation = recognizer.location(in: canvas)

        for shapeLayer in shapeLayers {
            guard let path = shapeLayer.path else { continue }

            let tempPath = path.copy(strokingWithWidth: CGFloat(lineWidth * 2), lineCap: .round, lineJoin: .round, miterLimit: .zero)

            if tempPath.contains(tapLocation) {
                // DO SOMETHING
            }
        }
    }

Answer 1

You need to get the tap location in the transformed layer's own geometry.

@objc private func userTapped(recognizer: UITapGestureRecognizer) {
    let canvasLocation = recognizer.location(in: canvas)

    for shapeLayer in shapeLayers {
        guard let path = shapeLayer.path else { continue }
        let shapeLocation = shapeLayer.convert(canvasLocation, from: canvas.layer)

        let tempPath = path.copy(strokingWithWidth: CGFloat(lineWidth * 2), lineCap: .round, lineJoin: .round, miterLimit: .zero)

        if tempPath.contains(shapeLocation) {
            // DO SOMETHING
        }
    }
}