Question

I am customizing a UITableViewCell with several subviews:

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
  self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
  if (self) {
    _mainView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 40.0f)];

    _hiddenOptionsView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 40.0f)];

    _menuView = [[CellMenuView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 20.0f)];

    [self addSubview:_menuView];
    [self addSubview:_hiddenOptionsView];
    [self addSubview:_mainView];
  }
  return self;
}

The class CellMenuView is a UIView subclass which has two UIButtons with their counterpart target actions setup on initialization:

- (id)initWithFrame:(CGRect)frame {   
  self = [super initWithFrame:frame];
  if (self) {
    UIImageView *background = [[UIImageView alloc] initWithFrame:frame];
    [background setImage:[UIImage imageNamed:@"cell_menu_bg.png"]];
    [self addSubview:background];

    CGFloat buttonX = frame.origin.x;
    CGFloat buttonY = frame.origin.y + 3.0f;
    CGFloat buttonWidth = frame.size.width / 2.0f;
    CGFloat buttonHeight = 10.0f;

    _editButton = [UIButton buttonWithType:UIButtonTypeCustom];
    _editButton.frame = CGRectMake(buttonX, buttonY, buttonWidth, buttonHeight);
    _editButton.backgroundColor = [UIColor clearColor];
    _editButton.titleLabel.shadowColor = [UIColor blackColor];
    _editButton.titleLabel.shadowOffset = CGSizeMake(0.0f, -1.5f);
    _editButton.titleLabel.font = [UIFont boldSystemFontOfSize:22.0f];
    [_editButton setTitle:@"Edit" forState:UIControlStateNormal];
    [_editButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    [_editButton addTarget:self action:@selector(editButton:) forControlEvents:UIControlEventTouchUpInside];
    [self addSubview:_editButton];

    _fireButton = [UIButton buttonWithType:UIButtonTypeCustom];
    _fireButton.frame = CGRectMake(buttonWidth, buttonY, buttonWidth, buttonHeight);
    _fireButton.backgroundColor = [UIColor clearColor];
    _fireButton.titleLabel.shadowColor = [UIColor blackColor];
    _fireButton.titleLabel.shadowOffset = CGSizeMake(0.0f, -1.5f);
    _fireButton.titleLabel.font = [UIFont boldSystemFontOfSize:22.0f];
    [_fireButton setTitle:@"Fire" forState:UIControlStateNormal];
    [_fireButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    [_fireButton addTarget:self action:@selector(fireButton:) forControlEvents:UIControlEventTouchUpInside];
    [self addSubview:_fireButton];

    return self;
  }
}

I have implemented the target action methods but they aren’t being executed. Instead, didSelectRowAtIndexPath: takes precedence over the touch up events inside buttons every time I pressed one of them.

The only way I have been able to fire the events on buttons is making sure that one of the letters in UIButton's title is touched (using the simulator, of course).

I must say that _menuView is hidden behind the other subviews and shown below the cell when a custom accessory button in cell is pressed. It appears by modifying the Y origin and disappears by setting it to 0.0f again.

I think it may be related to the view hierarchy, because I haven’t had any problems in the past by adding buttons directly to the cell. But I’m just guessing here.

How can I make the events on buttons take precedence over the didSelectRowAtIndexPath: method?

Thanks!

Answer 1

Implement

- (NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath

And return nil for the indexPath you don’t want selected; this will prevent didSelectRowAtIndexPath from being called on that cell, and (hopefully), your custom action will be called.

Update: After implementing this myself (adding borders to the buttons), this is what I have.

The code to achieve this (which is different than yours), is as follows:

CellMenuView.m

    self.backgroundColor = [UIColor blackColor];
    _editButton.layer.borderColor = [UIColor whiteColor].CGColor;
    _editButton.layer.borderWidth = 2;
    _fireButton.layer.borderColor = [UIColor whiteColor].CGColor;
    _fireButton.layer.borderWidth = 2;

UITableViewCell subclass

    // Change in height to make it taller
    _menuView = [[TestBtn alloc] initWithFrame:CGRectMake(0.0f, 20.0f, 320.0f, 60.0f)];

UITableViewController subclass

    self.tableView.rowHeight = 100;

After testing, mine works as expected. If I click within the white squares, the button action is performed as normal, and didSelectRowAtIndexPath is not called. didSelectRowAtIndexPath is only called when I click outside of the buttons.

I think the issue here might be your button heights/frames, as well as your row height. Add borders to your buttons, to check its clickable area, and increase the height of the button to increase the clickable area.