How to prevent tableview cell registering a tap when a button is overlaid on top of a tableview?

Question

My app has a tab bar, and I have added a large button in the centre of the tab bar. To achieve this I simply create a button and add it to the tab bar as a subview.

The top part of the button goes over the top edge of the tab bar, sitting on top of the tableview. Here is a screen shot.

When I tap the bottom part of the button (the green arrow), it works fine, but if I tap the top part of the button (the red arrow) - the bit that overlays the tableview - the button's action is not triggered and instead the cell under the button is registering a tap.

How can I prevent this?

Answer 1

If the views frame sticks out of its superview frame, you will not receive any touches events that exceed the superview frame. This is what is happening here, since the large button is probably a subview of the TabBar. To resolve this add button as the subview of the TabBarControllers view rather than the TabBar and setup appropriate constraints.

An alternative solution would be to create a dedicated UIButton subclass for this large button and override hitTest(point:event:) method.

For reference: Capturing touches on a subview outside the frame of its superview using hitTest:withEvent: