Question

I am designing an editable UITableViewCell^*. In the normal state, my cell should look like the portion of this image above the red line.

When users click [Edit...], the controls letting the user change the settings will show up, and the text of the [Edit...] button will become [Done]. Clicking [Done] will hide the portion below the red line, and change the text on the button back to [Edit...].

I am trying to achieve this effect by changing the height of the row in the delegate. When the cell is in edit mode, it’s returning the full height; when the cell is not in edit mode, the height of the upper portion from the red line on is returned. Unfortunately, when I do that, the edit controls “slide up”, obscuring the rest of the cell. I am fixing this by making these controls invisible in the edit mode, but I think there should be a better solution.

Are there settings that I could apply to the controls in order to let me cut off the bottom, clipping the content below the red line?

---

^* I am using Interface Builder to design my cell, in case it matters.

Answer 1

In your xib – just turn on the top strut

This is working for me. To make it smoothly expand and contract you’ll need to use the trick of an empty beginUpdates/endUpdates call

[tableView beginUpdates];
[tableView endUpdates];