canvas判断用户是否点击在一条线上

Posted by Yinode on Wednesday, October 2, 2019

TOC

该实现为 IOS 的 swift,但是可以运用在任何 UI 平台,主要原理就是把一条线切分成一个个的点,然后判断用户的点击与这条线上的点进行逐一判断 是否距离小于某个阈值

// point 为用户的点击位置
// finishedLines 为屏幕中的 line 列表
// stride 可以生成一个系数列表 exp 中生成的列表大概是这样 [0,0.05,0.1,0.15 ....]
    func indexOfLine(at point: CGPoint) -> Int? {
        for (index,line) in finishedLines.enumerated() {
            let begin = line.begin
            let end = line.end
            
            for t in stride(from: CGFloat(0), to: 1.0, by: 0.05){
                let x = begin.x + ((end.x - begin.x) * t)
                let y = begin.y + ((end.y - begin.y) * t)
                if(hypot(x - point.x, y - point.y) < 20.0){
                    return index
                }

            }

        }
        return nil
    }