iOS how to set a UITableViewCell background transparent

[manman]

i'm trying to set the background of a custom UITableViewCell to transparent so you can only see the control inside of it, but I can't get it to work

I've tried setting the opaque property to NO, as well as setting the backgroundView backgroundColor to clearColor, but neither have worked for me so far. Is there another way to do this?

Thanks

 

[supertoto]

Mark this thread!

I also have the same problem, after I read the guide, now I have changed my design to meet the UI design principles.

Maybe, change your design or reconsider your design is much easier way to go. (Just from my perspective)

 

[manman]

i'm very new to a lot of this, so I'm willing to try anything that works. I just don't know what alternate design 'the guide' recommends! thanks for your response though

 

[Luke Redpath]

Not only do you need to set the background color of the cell to clearColor, you need to make sure all of your subviews are clear as well.

 

[dejo]

i'm trying to set the background of a custom UITableViewCell to transparent so you can only see the control inside of it, but I can't get it to work

What do you mean the control is "inside" of the table cell? Are you adding the control into the cell in Interface Builder or through the code?

 

[manman]

Not only do you need to set the background color of the cell to clearColor, you need to make sure all of your subviews are clear as well.

Thanks for the reply, I'll give it a shot. My subview is at the origin of the cell and I set the height/width before setting it as a subview, but I think I read somewhere that the cell will override that. Does the cell make it's view take up the full frame of the cell by default? Otherwise I would have thought that setting the cell background transparent would at least make /part/ of the cell transparent..

to dejo:
the control is wrapped by a custom cell. I'm setting the control as a subview of the cell in code.

 

[manman]

hi, I'm still looking for some help with this if anyone has any insight. I have a custom cell with a background view, and a content view that is set to the view for my control- say a button in this case.

I've tried setting the background view's background color to clearColor, setting it's 'Opaque' property to NO, as well as doing the same thing for the content view, and for good measure, creating the button the same way before I set it to be the Cell's content view. After all that, i don't see any change at all, the cell's background still appears white and no part of it is transparent...

Here is some code to show how I set up the custom cell:

- (id)initWithFrame:(CGRect)aRect reuseIdentifier:(NSString *)identifier
{
	if (self = [super initWithFrame:aRect reuseIdentifier:identifier])
	{
		// turn off selection use
		self.selectionStyle = UITableViewCellSelectionStyleNone;
		self.backgroundView.backgroundColor = [UIColor clearColor];
    	self.contentView.backgroundColor = [UIColor clearColor];
		self.backgroundView.opaque = NO;
		self.contentView.opaque = NO;
	}
	return self;
}

- (void)setView:(UIView *)inView
{
	if (view)
		[view removeFromSuperview];
	view = inView;
	[self.view retain];	
	
	self.backgroundView.backgroundColor = [UIColor clearColor];
	self.contentView.backgroundColor = [UIColor clearColor];
 	self.backgroundView.opaque = NO;
	self.contentView.opaque = NO;
	self.view.backgroundColor = [UIColor clearColor];

	[self.contentView addSubview:inView];
	
	[self layoutSubviews];
}

I realize there's a lot of overkill there, but I was trying everything I could think of...

 

[zavieh]

Changing the background color of a UITableViewCell

Here is a workaround, which bypasses the backgroundColor property, apparently ignored.

Here is a demo with cells of different colors, based on the length of their labels:

This method subclasses UITableViewCell, and you need to explicitly invoke
[ cell setCellColor:[ UIColor color_of_your_choice ] ];
in your
- (UITableViewCell *)tableView: (UITableView *)tableView cellForRowAtIndexPath: (NSIndexPath *)indexPath
It works by recursively setting the background color to all subviews, which may not be advisable in all cases.

/**
 * @file    ColorUITableViewCell.h
 **/

#import <UIKit/UIKit.h>

@interface ColorUITableViewCell : UITableViewCell {
    UIColor*    cellColor;
}
- (void) setCellColor: (UIColor*)color;

@end

/**
 * @file    ColorUITableViewCell.m
 **/

#import "ColorUITableViewCell.h"

@implementation ColorUITableViewCell

- (void) setCellColor: (UIColor*)color
{
    cellColor = color;
}

- (void) spreadBackgroundColor: (UIView*)that withColor: (UIColor*)bkColor
{
    NSEnumerator *enumerator = [that.subviews objectEnumerator];
    id anObject;
    
    while (anObject = [enumerator nextObject]) {
        if( [anObject isKindOfClass: [ UIView class] ] )
        {
            ((UIView*)anObject).backgroundColor = bkColor;
            [ self spreadBackgroundColor:anObject withColor:bkColor];
        }
    }
}

- (void)layoutSubviews {
    [super layoutSubviews];
    if( !self.selected && NULL != cellColor)
    {
        [ self spreadBackgroundColor:self withColor:cellColor ];
    }
}

@end

X.

 

[olegueret]

The way I do it without subclassing (tested only with grouped tables), is changing cell's backgroundView:

if (!cell) { 
    cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:@"aCell"] autorelease];
				
    UIView *transparentBackground = [[UIView alloc] initWithFrame:CGRectZero];
    transparentBackground.backgroundColor = [UIColor clearColor];
    cell.backgroundView = transparentBackground;

    // more customizations here...
}

 

[c121hains]

This code worked..

The way I do it without subclassing (tested only with grouped tables), is changing cell's backgroundView:

if (!cell) { 
    cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:@"aCell"] autorelease];
				
    UIView *transparentBackground = [[UIView alloc] initWithFrame:CGRectZero];
    transparentBackground.backgroundColor = [UIColor clearColor];
    cell.backgroundView = transparentBackground;

    // more customizations here...
}

I wanted to have a transparent cell in a grouped table similar to how the contact details view in the native iPhone Contact app works.

ie.
1 - Click on Contacts
2 - Click on Recents tab at bottom
3 - Select Detail --> for a recent call
This view contains a table where the first to rows contain a transparent customized cell.

In my method cellForRowAtIndexPathNSIndexPath *)indexPath method, I placed this code and it worked exactly how I expected.

Thanks