UIButton receiving touch events outside bounds when set as leftView of UITextField - iphone

Question

This has been a bit of a head scratcher for me. In an app I'm building I am using a UITextField, and adding a button as the leftView property. However, it seems that on an iPad (both sim and on device), the button is receiving touches that are well outside its bounds. This is interfering with the ability of the UITextField to become the first responder when the user touches the placeholder text. It seems that when touching the placeholder text, the events are being handled by the button instead of the text field itself. Strangely, this only appears to happen on iPad; it works as expected on the iPhone.
Here is some simple code demonstrating the problem:
- (void)viewWillLayoutSubviews {
[super viewWillLayoutSubviews];
UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(10.0f,
10.0f,
(self.view.frame.size.width - 20.0f),
35.0f)];
textField.borderStyle = UITextBorderStyleRoundedRect;
textField.placeholder = #"Test text";
[self.view addSubview:textField];
UIButton *addButton = [UIButton buttonWithType:UIButtonTypeContactAdd];
[addButton addTarget:self action:#selector(touchDown:) forControlEvents:UIControlEventTouchDown];
[addButton addTarget:self action:#selector(touchUpInside) forControlEvents:UIControlEventTouchUpInside];
[addButton addTarget:self action:#selector(touchUpOutside) forControlEvents:UIControlEventTouchUpOutside];
textField.leftView = addButton;
textField.leftViewMode = UITextFieldViewModeAlways;
}
- (void)touchDown:(id)sender {
NSLog(#"touchDown");
}
- (void)touchUpInside {
NSLog(#"touchUpInside");
}
- (void)touchUpOutside {
NSLog(#"touchUpOutside");
}
It seems that sometimes touches are still perceived as being inside even though they appear to be outside the button's bounds. Then getting even further right, the button only receives UIControlEventTouchDown then UIControlEventTouchUpOutside.
2013-07-25 11:51:44.217 TestApp[22722:c07] touchDown
2013-07-25 11:51:44.306 TestApp[22722:c07] touchUpInside
2013-07-25 11:51:44.689 TestApp[22722:c07] touchDown
2013-07-25 11:51:44.801 TestApp[22722:c07] touchUpOutside
EDIT
Here is an example with the background color of the button changed as well as the approximate zones that trigger the events above. Also, I checked the frame of the button and it is less than 30px wide.

Answer 1

I sat down and spent some more time on this last night. I was already subclassing UITextField in my real application, so I ended up overriding -(id)hitTest:withEvent: as seen below. This has been working fine so far.
- (id)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
if ([[super hitTest:point withEvent:event] isEqual:self.leftView]) {
if (CGRectContainsPoint(self.leftView.frame, point)) {
return self.leftView;
} else {
return self;
}
}
return [super hitTest:point withEvent:event];
}

Answer 2

I verified your results. I think it's most likely a bug in UITextView. Unfortunately, for some reason if you set leftView, events in that area are being sent to the wrong view (on the iPad).
I don't have a simple workaround for you since adjusting the frame of the leftView has no effect. I think it needs to be fixed at a lower level than we have access to. Maybe report the bug to Apple and live with it for now?
You could track the location of the touch and ignore it if it's out of bounds, but it seems like a lot of work for a minor bug?

Answer 3

Just met this question too, for some other solution I found is adding a check whether the event point located inside the button.
- (void)touchUpInside:(UIButton *)sender event:(UIEvent *)event
{
CGPoint location = [[[event allTouches] anyObject] locationInView:sender];
if (!CGRectContainsPoint(sender.bounds, location)) {
// Outside of bounds, so ignore:
return;
}
// Inside our bounds, so continue as normal:
}