How to switch a UITableViewCell from "normal" view to transparent, and back again

Question

I have a table view which flips back and forth between view mode and edit mode. I have one cell which I would like to be transparent in view mode, and look like a "normal" cell in edit mode (i.e. white background, rounded rectangle outline). Basically, the same thing you see the name cell do in the contacts app as you switch in & out of edit mode.

I used the solution in How to create a UITableViewCell with a transparent background to get a transparent background, but I can't figure out how to get the original background back.

Currently, I create two background views in viewDidLoad:

nameCellDefaultBackview = [[UIView alloc] initWithFrame:CGRectZero];
nameCellDefaultBackview.backgroundColor = [UIColor clearColor];

nameCellEditBackview = [[UIView alloc] initWithFrame:CGRectZero];
nameCellEditBackview.backgroundColor = [UIColor whiteColor];

I then give my cell the default background view:

nameCell.backgroundView = nameCellDefaultBackview;

In setEditing:animated: I set the background of the cell depending on the editing mode:

if (editing) {
    nameCell.backgroundView = nameCellEditBackview;
} else {
    nameCell.backgroundView = nameCellDefaultBackview;
}

The problem is, in editing mode I get a white rectangle instead of something that looks like a cell - which is precisely what I asked for, but not what I want :). I've tried a couple of other things, like setting backgroundView to nil (which seems to = no change), and saving the 'initial' background view in viewDidLoad (that didn't seem to work, and looking in the debugger the variable was 0x0 when I tried to assign it to the cell in setEditing).

So what I want is to look like this in normal mode:

normal mode

And like this in edit mode:

edit mode

But what I currently get in edit mode is:

current edit view

So how do I get the white background/border/rounded corners back?

score 0 · Answer 1 · edited May 23 '17 at 11:50

0

If you want to use back the original cell in edit mode, you should consider showing and hiding the cell instead of setting the background view. The background view is added as a subview behind all other views, thus, setting it to transparent has no effect. Reference: Apple Doc.

To hide or show a table cell, see this post

edited May 23 '17 at 11:50

Community

1
1

answered Aug 22 '12 at 02:25

Rick

1,818
1
15
18

Thanks Rick. I don't actually want to remove the cell, just change it's background back and forth between transparent & white. The code above does make it transparent (so the text is floating over the table background), but I can't seem to get it back to being opaque with the typical white/border/rounded corners. – Sasha Aug 24 '12 at 00:10
Oh, so that's what you wanted. See if KDaker's answer helps. – Rick Aug 24 '12 at 05:29
I should have included the screen shots to begin with :). Thanks for your input though, I still learned something! – Sasha Aug 24 '12 at 15:27

score 0 · Answer 2 · answered Aug 24 '12 at 04:15

0

for editing mode, dont set the backgroundView. Just call [tableView reloadData] when you enter editing mode and set the backgroundView in cellForRowAtIndexPath like this:

if (!editing) {
    nameCell.backgroundView = nameCellDefaultBackview;
}
//if it is editing, then it will take the default style.

hope this helps.

answered Aug 24 '12 at 04:15

KDaker

5,899
5
31
44

Thanks KDaker. I tried your suggestion, but the cell never reverts to the default style (ie, it stays transparent, even in edit mode). I stepped through with the debugger and confirmed that the code above is being executed as expected - do I need an else? Right now, the cell is in the same nib as the table, should I put it in it's own nib so that I can reload from the nib? – Sasha Aug 24 '12 at 15:46
well... hmm see the problem with your original code is this `nameCellEditBackview = [[UIView alloc] initWithFrame:CGRectZero];` . It is causing the cell to appear white without a frame. You need to, somehow, restore the frame of the cell. One way i can think of, is to try and store the original view as an instance variable `origFrame = nameCell.backgroundView`. and then reassign it back in edit mode. hope this works. – KDaker Aug 24 '12 at 16:18
I did try this originally, but for some reason when I tried to use origFrame later it was nil. I was "capturing" the original frame in viewDidLoad (see original question), but theorized that the cell wasn't initialized yet and hence there was nothing to capture? Either way, it didn't work :(. Thanks for your input though, I've found a work around. – Sasha Aug 24 '12 at 16:32

score 0 · Accepted Answer · answered Aug 24 '12 at 16:29

I've decided to change my approach a bit, and this is now working:

Instead of trying to show/hide the background of one cell, I now have two cells:

IBOutlet UITableViewCell *nameCellViewMode;
IBOutlet UITableViewCell *nameCellEditMode;

In viewDidLoad: I change the background of nameCellViewMode to make it transparent:

UIView *clearBackgroundView = [[UIView alloc] initWithFrame:CGRectZero];
clearBackgroundView.backgroundColor = [UIColor clearColor];

nameCellViewMode.backgroundView = clearBackgroundView;

In following with KDaker's suggestion I now just do a tableView reloadData in setEditing:animated:, and then in cellForRowAtIndexPath I do this:

if (self.editing)
{
   return nameCellEditMode;
}
else
{
   return nameCellViewMode;
}

How to switch a UITableViewCell from "normal" view to transparent, and back again

3 Answers3