圆形View的点击区域

需求

任务进度的圆形区域可以点击(黄色圆圈内的部分都可以点击)

15300833198943.jpg

实现方法

实现思路

1. 通过上图红色方框的UIView增加手势，如果仅仅是通过touchView.layer.cornerRadius的方式是无法将上图红色矩形的触摸区域变成黄色的圆形触摸区域。
2. 通过hitTest:withEvent方法进行处理，判断圆圈范围，响应其触摸事件。若不在圆圈内，则不处理触摸事件。

代码

- (BOOL)touchPointInsideCircle:(CGPoint)center radius:(CGFloat)radius targetPoint:(CGPoint)point
{
    CGFloat dist = sqrtf((point.x - center.x) * (point.x - center.x) +
                         (point.y - center.y) * (point.y - center.y));
    return (dist <= radius);
}

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    UIView *hitView = nil;
    
    BOOL pointInRound = [self touchPointInsideCircle:self.touchView.center radius:163/2.0 targetPoint:point];
    if (pointInRound) {
        hitView = self.touchView;
    } else {
        hitView = self;
    }
    return hitView;
}

- (UIView *)touchView
{
    if (!_touchView) {
        _touchView = [[UIView alloc] init];
        _touchView.frame = CGRectMake(0, 0, 163, 163);
        _touchView.centerX = self.frame.size.width/2.0;
        _touchView.centerY = self.frame.size.height/2.0;
        _touchView.layer.cornerRadius = 163/2.0;
        _touchView.layer.masksToBounds = YES;
        _touchView.clipsToBounds = YES;
        UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(touthVoid)];
        [_touchView addGestureRecognizer:tapGesture];
    }
    return _touchView;
}