Question

I have a grouped UITableView with custom cells (created by subclassing UITableViewCell). I add subviews and insert sublayers just like this:

[self.contentView addSubview:myUILabel];

and

[self.contentView.layer insertSublayer:myCALayer];

When entering editing mode for deleting rows, the cells move right and myUILabel and myCALayer go beyond the borders of the cell, which looks ugly.

I tried this:

Grouped UITableView with custom UILabels in Editing Mode

… but it didn’t help.

What “kind of” worked is to override setEditing: in my custom cell

- (void)setEditing:(BOOL)editing animated:(BOOL)animated {
    CGRect oldBounds = self.myCALayer.bounds;
    CGRect newBounds = oldBounds;
    CGPoint oldPosition = self.myCALayer.position;
    CGPoint newPosition = oldPosition;
    //move right
    if (editing && !self.showingDeleteConfirmation) {
        newBounds.size.width -=32;
        newPosition.x -= 15;
    }
    //move back left
    else if (self.editing) {
        newBounds.size.width += 32;
        newPosition.x += 15;
    }
    self.myCALayer.bounds = newBounds;
    self.myCALayer.position = newPosition;
    [super setEditing:editing animated:animated];
}

… however, the animations are not performed synchronously. What happens is while the cell moves right when entering editing mode, first the width of the layer shrinks, and then the position changes. Although the layer finally fits the cell, the animation looks bad.

Thanks for your advice!

Answer 1

Not sure about your layers, but you should be able to set a smart autoresizingMask on your subviews so they re-layout appropriately when the size of contentView is altered by the tableview (on entry to edit mode).

More here.

Edit: with a little looking, I think CALayer‘s anchorPoint property may help with your sublayers. (more here)

Alternatively (and this is a bit of a hack, and could hurt performance somewhat), you could set your custom layers on a UIView w/ an appropriately set autoresizingMask.