UITableViewCell delete button gets covered up

Question

UPDATE:

Thanks to information from "Evgeny S" I've been able to determine that what is covering up the delete button is the cell background. I had the following function called at the beginning of cell init:

- (void) setupGradientsWithHeight:(int) the_height
{
    CAGradientLayer* gradient = [CAGradientLayer layer];

    gradient.frame  = CGRectMake(self.bounds.origin.x,
                                 self.bounds.origin.y,
                                 self.bounds.size.width,
                                 the_height);

    gradient.colors = [NSArray arrayWithObjects:
                       (id)[UIColor colorWithRed:218.0f/255.0f
                                           green:218.0f/255.0f
                                            blue:220.0f/255.0f
                                           alpha:1.0].CGColor,
                       (id)[UIColor colorWithRed:180.0f/255.0f
                                           green:180.0f/255.0f
                                            blue:184.0f/255.0f
                                           alpha:1.0].CGColor,nil];

    UIView* bgview = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1, 1)];

    [bgview.layer addSublayer:gradient];
    [self setBackgroundView:bgview];
}

The problem is solved by NOT adding the backgroundview. However, I'm wondering how it might be solved while preserving the gradient background for each cell?

One of two things could be happening. When the delete button appears the background view is either being shifted and then back - or its size is being decreased and then back. I tried messing with the width component "self.bounds.size.width" for the gradient frame but I still don't see how that could be affecting things because this function is only called once at cell initialization.

ORIGINAL POST:

I had created an App in Xcode4 under iOS6 SDK - but after loading things up in the new environment (Xcode5 and iOS7 SDK) I ran into a problem. Note that I have resolved all build errors and warnings that came up when making the transition.

I have a tableview with some cells. After entering edit mode, if one clicks the red toggle button to initiate delete mode for a cell - the animation begins and the "Delete" button appears - but only briefly and is then suddenly re-hidden.

Another strange thing I should note is that even while the delete button is covered up - you can still click where it should be and delete the cell.

I've tried to take out as much of my "custom code" as possible, I've removed functions that I had overridden and tried to take things back to an original state as possible - but to no avail.

At one point I had seen a strange message in the output log: "attempting to set a swipe to delete cell when we already have one....that doesn't seem good". For some reason the message is on longer appearing and I can't seem to remember what I was doing at the time.

Any thoughts or recommendations on what might be causing this?

http://www.youtube.com/watch?v=vCAGzSaOwp4

Answer 1

If you have project started in iOS 6 SDK and use storyboards, this might be the issue with constraints. Try deleting all of cells constraints and fall back to suggested. This could resolve issues with delete button. I had such problems in two different projects and they were resolved described way.

Answer 2

You can use the colorWithPatternImage but for me it was easier to use the self.layer.content. for example :

cell.layer.contents = (id)[UIImage imageNamed:@"singleRow.png"].CGImage;

That way the image don't get stretched and it doesn't have to be in exact size. That way the delete button doesn't get covered up by the cell background image. By The Way: these custom gradient backgrounds don't seem to match up with the iOS 7 basic appearances, do you think that could be a grounds for not approving the app?

Answer 3

This is one of countless bugs in iOS 7.

For some reason the backgroundView is moved by iOS over the delete button. You can work-around this by subclassing your backgroundView and implementing the setFrame function of your derived view like this:

- (void)setFrame:(CGRect)frame
{
    if ([[[UIDevice currentDevice] systemVersion] compare:@"7.0" options:NSNumericSearch] != NSOrderedAscending) {
        // background view covers delete button on iOS 7 !?!
        [super setFrame:CGRectMake(0, frame.origin.y, frame.size.width, frame.size.height)];
    } else {
        [super setFrame:frame];
    }
}

As a side note: you can avoid the need for a separate sublayer by subclassing and implementing layerClass in your derived view:

+ (Class)layerClass
{
    return [CAGradientLayer class];
}

Answer 4

I'm still seeing this problem after updating to XCode 5.0.1 but I've used a different workaround which is to use a boolean named changeTitle set to NO in willBeginEditingRowAtIndexPath and set to YES in editingStyleForRowAtIndexPath if we're not in row deletion mode.

Then I use that variable to pad the button title with some extra spaces in titleForDeleteConfirmationButtonForRowAtIndexPath.

-(NSString *)tableView:(UITableView *)tableView titleForDeleteConfirmationButtonForRowAtIndexPath:(NSIndexPath *)indexPath {
    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7.0 && changeTitle) {
        return @"        Delete";
    }
    return @"Delete";
}

It works for me but the main drawback is that the confirmation area is wider than you think it is so an unintentional delete is possible.

Answer 5

- (void)layoutSubviews
{
    [super layoutSubviews];
    [self sendSubviewToBack:self.contentView];
}

Answer 6

And one more workaround:

- (void) layoutSubviews {
    [super layoutSubviews];

    if ([ [ [UIDevice currentDevice] systemVersion] compare: @"7.0" options: NSNumericSearch] != NSOrderedAscending) {
        if (iOS7 == YES) {
            self.backgroundView.frame = CGRectMake(0, self.backgroundView.frame.origin.y,
                                                   self.backgroundView.frame.size.width, self.backgroundView.frame.size.height);
    }
}