检测厚 UIBezierPath 上的触摸

Question

在我的应用程序的绘图部分，用户应该能够选择他们创建的路径。UIBezierPath有一个方便的方法containsPoint:，在大多数情况下效果很好，但是当绘制的线接近没有曲线的直线时，它会特别糟糕。让你的手指碰到一条直线是非常困难的。

该方法似乎只检查路径上很窄的一条线，即使将lineWidth路径的属性设置为较大的值也不会影响containsPoint:测试结果。

我看过类似的问题，比如这个：检测 UIBezierPath 笔触上的触摸，不是填充但无法修改解决方案以查看“路径周围的区域”，它似乎只查看中心的细线其中。

编辑

我提出的一个有效但密集的解决方案是将路径转换为 ​​aUIImage并在请求的点检查该图像的颜色。如果 alpha 分量大于零，则路径与触摸相交。

这看起来像这样：

// pv is a view that contains our path as a property
// touchPoint is a CGPoint signifying the location of the touch
PathView *ghostPathView = [[PathView alloc] initWithFrame:pv.bounds];
ghostPathView.path = [pv.path copy]; // make a copy of the path
// 40 px is about thick enough to touch reliably
ghostPathView.path.lineWidth = 40; 
// the two magic methods getImage and getColorAtPoint: 
// have been copied from elsewhere on stackoverflow 
// and do exactly what you would expect from their names
UIColor *color = [[ghostPathView getImage] getColorAtPoint:touchPoint];
CGFloat alpha;
[color getWhite:nil alpha:&alpha];

if (alpha > 0){
// it's a match!
}

以下是辅助方法：

// in a category on UIImage
- (UIColor *)getColorAtPoint:(CGPoint)p {
    // return the colour of the image at a specific point

    // make sure the point lies within the image
    if (p.x >= self.size.width || p.y >= self.size.height || p.x < 0 || p.y < 0) return nil;

    // First get the image into your data buffer
    CGImageRef imageRef = [self CGImage];
    NSUInteger width = CGImageGetWidth(imageRef);
    NSUInteger height = CGImageGetHeight(imageRef);
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    unsigned char *rawData = (unsigned char*) calloc(height * width * 4, sizeof(unsigned char));
    NSUInteger bytesPerPixel = 4;
    NSUInteger bytesPerRow = bytesPerPixel * width;
    NSUInteger bitsPerComponent = 8;
    CGContextRef context = CGBitmapContextCreate(rawData, width, height,
                                                 bitsPerComponent, bytesPerRow, colorSpace,
                                                 kCGImageAlphaPremultipliedLast | kCGBitmapByteOrder32Big);
    CGColorSpaceRelease(colorSpace);

    CGContextDrawImage(context, CGRectMake(0, 0, width, height), imageRef);
    CGContextRelease(context);

    // Now your rawData contains the image data in the RGBA8888 pixel format.
    int byteIndex = [[UIScreen mainScreen] scale] * ((bytesPerRow * p.y) + p.x * bytesPerPixel);
    CGFloat red   = (rawData[byteIndex]     * 1.0) / 255.0;
    CGFloat green = (rawData[byteIndex + 1] * 1.0) / 255.0;
    CGFloat blue  = (rawData[byteIndex + 2] * 1.0) / 255.0;
    CGFloat alpha = (rawData[byteIndex + 3] * 1.0) / 255.0;

    free(rawData);

    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
}

// in a category on UIView
- (UIImage *)getImage {
    UIGraphicsBeginImageContextWithOptions(self.bounds.size, NO, [[UIScreen mainScreen]scale]);
    [[self layer] renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return viewImage;
}

有没有更优雅的方法来做到这一点？

编辑

Satachito 的好答案，只是想将它包含在 Obj-C 中以确保完整性。我使用的是 40 pt 笔划，因为它更接近 Apple 推荐的最小触摸目标尺寸 44x44 像素。

CGPathRef pathCopy = CGPathCreateCopyByStrokingPath(originalPath.CGPath, nil, 40, kCGLineCapButt, kCGLineJoinMiter, 1);
UIBezierPath *fatOne = [UIBezierPath bezierPathWithCGPath:pathCopy];
if ([fatOne containsPoint:p]){
    // match found
}

Answer 1

使用 'CGPathCreateCopyByStrokingPath'

    let org = UIBezierPath( rect: CGRectMake( 100, 100, 100, 100 ) )
    let tmp = CGPathCreateCopyByStrokingPath(
        org.CGPath
    ,   nil
    ,   10
    ,   CGLineCap( 0 )  //  Butt
    ,   CGLineJoin( 0 ) //  Miter
    ,   1
    )
    let new = UIBezierPath( CGPath: tmp )

制作原始路径的描边路径。并使用原始路径和描边路径测试命中。