Smaller active area for circle shaped Custom button

Question

I have a custom button (which uses a a circled shaped image as its custom view). The problem is: the active area of the custom button is much too large, if I tap at least 100 pixels outside the button, it still gets registered as a tap on the button. This results in accidental taps.

Note:- I don't want to reduce size of button as it is already bigger that minimum requirement. I want to reduce tappable space.

How can I reduce the active area on these buttons?

Answer 1

If your button isn't already a subclass of UIButton, it will have to be to achieve this. You can override pointInside:withEvent: to alter the "touchable" area to any arbitrary shape you want. A subclass that simply alters the hit box's insets might look something like this:

// --HEADER--
@interface TouchInsetButton : UIButton
@property (nonatomic, assign) UIEdgeInsets touchInsets;
@end

// --IMPLEMENTATION--
@implementation TouchInsetButton
@synthesize touchInsets = _touchInsets;

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
{
    CGRect modifiedHitBox = UIEdgeInsetsInsetRect([self bounds], _touchInsets);
    return CGRectContainsPoint(modifiedHitBox, point);
}

@end

Just note that, as you noticed, UIButtons normally use a bounding box that's slightly larger than their bounds. Just using this subclass without setting any insets will result in a button that only accepts hits that are completely within the button's bounds.