How do I prevent touches from hitting hidden content in SKCropNode?

Question

I'm making pretty heavy use of SKCropNode in my game both for stylistic uses and also in one case where I've built my own SpriteKit version of UIScrollView . I've noticed that when I get a touch event or when a gesture recognizer fires at a certain point, SKScene.nodeAtPoint(...) is still hitting nodes that are hidden at the touch point from the crop node.

How do I prevent SKScene.nodeAtPoint(...) from hitting cropped content, and instead return the next visible node beneath it?

Answer 1

You can't. Everything is based on the frame of the content, and with crop nodes, it is huge. The only thing you can do is check the point of touch, use nodesAtPoint to get all nodes, then enumerate one by one, checking whether or not the touch point is touching a visible pixel by either checking the pixel data, or having a CGPath outlining of your sprite and checking if you are inside that.

Answer 2

I managed to work my way around this one, but it isn't pretty and it doesn't work in every scenario.

The idea is, when a touch is recorded, I iterate over all nodes at that point. If any of those nodes are (or are children of) SKCropNodes, I check the frame of the mask on the crop node. If the touch lies outside the mask, we know the node is not visible at that point and we can assume the touch didn't hit it.

The issue with this method is that I don't do any evaluation of transparency within the crop mask - I just assume it's a rectangle. If the mask is an abnormal shape, I may give false positives on node touches.

extension SKScene {
    // Get the node at a given point, but ignore those that are hidden due to SKCropNodes.
    func getVisibleNodeAtPoint(point: CGPoint) -> SKNode? {
        var testedNodes = Set<SKNode>()

        // Iterate over all the nodes hit by this click.
        for touchedNode in self.nodesAtPoint(point) {
            // If we've already checked this node, skip it. This happens because nodesAtPoint
            // returns both leaf and ancestor nodes, and we test the ancestor nodes while
            // testing leaf nodes.
            if testedNodes.contains(touchedNode) {
                continue
            }

            var stillVisible = true

            // Walk the ancestry chain of the target node starting with the touched
            // node itself.
            var currentNode: SKNode = touchedNode
            while true {
                testedNodes.insert(currentNode)

                if let currentCropNode = currentNode as? SKCropNode {
                    if let currentCropNodeMask = currentCropNode.maskNode {
                        let pointNormalizedToCurrentNode = self.convertPoint(point, toNode: currentCropNode)
                        let currentCropNodeMaskFrame = currentCropNodeMask.frame

                        // Check if the touch is inside the crop node's mask. If not, we
                        // know we've touched a hidden point.
                        if
                            pointNormalizedToCurrentNode.x < 0 || pointNormalizedToCurrentNode.x > currentCropNodeMaskFrame.size.width ||
                                pointNormalizedToCurrentNode.y < 0 || pointNormalizedToCurrentNode.y > currentCropNodeMaskFrame.size.height
                        {
                            stillVisible = false
                            break
                        }
                    }
                }

                // Move to next parent.
                if let parent = currentNode.parent {
                    currentNode = parent
                } else {
                    break
                }
            }

            if !stillVisible {
                continue
            }

            // We made it through the ancestry nodes. This node must be visible.
            return touchedNode
        }

        // No visible nodes found at this point.
        return nil
    }
}