Silversnail
Silversnail

Reputation: 386

Set background color of UITableViewCell

I have looked around to find a solution for setting the background color of the accessoryView to the same background color as the cell´s contentView.

    cell.contentView.backgroundColor = [UIColor colorWithRed:178/255.f green:14/255.f blue:12/255.f alpha:0.05];
    cell.accessoryView.backgroundColor =[UIColor colorWithRed:178/255.f green:14/255.f blue:12/255.f alpha:0.05];

There is a solution that works but only let me use one color for all cells.

cell.contentView.superView.backgroundColor = [UIColor redColor];

Is the only solution to not use the accessoryView and use an image instead?

Thanks!

Upvotes: 9

Views: 23672

Answers (6)

Sheila Santos
Sheila Santos

Reputation: 206

I struggled with this one for a little while too and resorted to creating a custom image with the accessory. But I just found this solution that works well and doesn't require a custom image. The trick is to change the cell's backgroundView color not the backgroundColor.

UIView *myView = [[UIView alloc] init];
if (indexPath.row % 2) {
    myView.backgroundColor = [UIColor whiteColor];
} else {
    myView.backgroundColor = [UIColor blackColor];
}
cell.backgroundView = myView;

No need to change the accessoryView or contentView background colors. They'll follow automatically.


Note for 2014. Very typically you wold use -(void)setSelected:(BOOL)selected animated:(BOOL)animated

So, you'd have a custom cell class, and you'd set the colours for the normal/selected like this...

HappyCell.h
@interface HappyCell : UITableViewCell
@property (strong, nonatomic) IBOutlet UILabel *mainLabel;
etc...
@end

HappyCell.m
@implementation HappyCell

-(id)initWithStyle:(UITableViewCellStyle)style
      reuseIdentifier:(NSString *)reuseIdentifier
    {
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self)
        {
        }
    return self;
    }

-(void)awakeFromNib
    {
    }

- (void)setSelected:(BOOL)selected animated:(BOOL)animated
    {
    [super setSelected:selected animated:animated];

    if(selected)
        {
        self.backgroundColor = [UIColor redColor];
        .. other setup for selected cell
        }
    else
        {
        self.backgroundColor = [UIColor yellowColor];
        .. other setup for normal unselected cell
        }
    }

@end

// to help beginners.......
// in your table view class, you'd be doing this...

-(NSInteger)tableView:(UITableView *)tableView
      numberOfRowsInSection:(NSInteger)section
    {
    return yourDataArray.count;
    }

-(UITableViewCell *)tableView:(UITableView *)tv
      cellForRowAtIndexPath:(NSIndexPath *)indexPath
    {
    NSInteger thisRow = indexPath.row;
    ContentsCell *cell = [tv
      dequeueReusableCellWithIdentifier:@"cellName"
      forIndexPath:indexPath]; 
    // "cellName" must be typed in on the cell, the storyboard
    // it's the "identifier", NOT NOT NOT the restorationID

    [cell setupForNumber: thisRow];
    cell.mainLabel.text = yourDataArray[ thisRow ][@"whatever"];
    cell.otherLabel.text = yourDataArray[ thisRow ][@"whatever"];

    return cell;
    }

hope it helps someone.

Upvotes: 19

Claudia Mardegan
Claudia Mardegan

Reputation: 567

For all lines with the same color

cell.backgroundColor = [UIColor colorWithRed:6.0/255.0 green:122.0/255.0 blue:145.0/255.0 alpha:1.0f];

For 2 colors

cell.backgroundColor = [UIColor colorWithRed:6.0/255.0 green:122.0/255.0 blue:145.0/255.0 alpha:1.0f];

    if ((cell.backgroundColor = (indexPath.row % 2 == 0 ? [UIColor colorWithRed:6.0/255.0 green:122.0/255.0 blue:145.0/255.0 alpha:1.0f] : [UIColor colorWithRed:2.0/255.0 green:68.0/255.0 blue:80.0/255.0 alpha:1.0f]))){
        cell.textLabel.textColor = [UIColor whiteColor];

}

Upvotes: 2

Keller
Keller

Reputation: 17081

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    cell.backgroundColor = [UIColor greenColor];
}

Using this UITableViewDelegate method, you can set the color of cells to different colors. Note that Apple explicitly advise you to make changes to the backgroundColor property within the tableView:willDisplayCell:ForRowAtIndexPath: method in the docs, which state:

If you want to change the background color of a cell, do so in the tableView:willDisplayCell:forRowAtIndexPath: method of your table view delegate

Indeed, in iOS 6, changes to the property from anywhere else (like the tableView:cellForRowAtIndexPath: method) would have no effect at all. That no longer seems to be the case in iOS 7, but Apple's advice to modify the property from within tableView:willDisplayCell:ForRowAtIndexPath: remains (without any explanation).

For alternating colors, do something like this example:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    if (indexPath.row % 2) {
        cell.backgroundColor = [UIColor yellowColor];
    } else {
        cell.backgroundColor = [UIColor redColor];    
    }
}

Upvotes: 28

Oliver Pearmain
Oliver Pearmain

Reputation: 20610

This worked for me:

cell.contentView.backgroundColor = [UIColor darkGreyColor];

Upvotes: 7

StoriKnow
StoriKnow

Reputation: 5867

For anyone else who might stumble on this and wants to set their UITableViewCell background to a pattern or texture rather than a solid color, you can do so like this:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    cell.backgroundColor = [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:@"pattern.png"]];
}

Upvotes: 0

ophychius
ophychius

Reputation: 2653

The best option to have different backgrounds and what not would probably be to make your own TableViewCell implementation, in there you can put the logic to show whatever you want based on content or index etc.

Upvotes: -1

Related Questions