unsunghero unsunghero - 2 months ago 14
iOS Question

Custom UISlider - Increase "hot spot" size

I have a custom UISlider that is relatively tough for big fingered people to grab hold of and slide due to the size of the "thumb image". Is there any way to increase the size of clickable / draggable area without altering the size of the image?

Here's the code I have for creating the custom slider if that helps:

[slider setMaximumTrackImage:[[UIImage imageNamed:@"max.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 20, 0, 20)]
forState:UIControlStateNormal];
[slider setMinimumTrackImage:[[UIImage imageNamed:@"min.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 20, 0, 20)]
forState:UIControlStateNormal];
[slider setThumbImage:[UIImage imageNamed:@"thumb.png"]
forState:UIControlStateNormal];

Answer

I ended up subclassing the UISlider and overriding this method:

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent*)event {
    CGRect bounds = self.bounds;
    bounds = CGRectInset(bounds, -10, -15);
    return CGRectContainsPoint(bounds, point);
}

This extends the touchable area by 10 pixels on the left and right and 15 pixels on the top and bottom.

Comments