1. Welcome to the new MacRumors forums. See our announcement and read our FAQ

how to set a UITableViewCell background transparent

Discussion in 'iPhone/iPad Programming' started by manman, Aug 31, 2008.

  1. macrumors regular

    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?

  2. macrumors newbie

    Mark this thread!:D

    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)
  3. macrumors regular

    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! :p thanks for your response though
  4. macrumors 6502a

    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.
  5. Moderator


    Staff Member

    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?
  6. macrumors regular

    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.
  7. macrumors regular

    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...
  8. macrumors newbie

    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;
     * @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 ];
  9. macrumors newbie

    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...
  10. macrumors newbie

    This code worked..

    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.

    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 cellForRowAtIndexPath:(NSIndexPath *)indexPath method, I placed this code and it worked exactly how I expected.


Share This Page