Overlay textLabel and UIImageView in UITableViewCell

Question

I have a problem positioning a textLabel and detailTextLabel into a custom UITableViewCell that has a UIImageView appearing behind the textLabel and detailTextLabel.

Refer to the image - it will make more sense --> what you're looking a UITableView, where each bubble represents a different UITableViewCell.

enter image description here

Essentially, I am trying to fit the textLabel and detailTextLabel into the bubble you see by expanding the bubble dimensions. However, no matter what I try the bubble will not change it's width and height even if I change the UIImageView frame or bounds or contentMode.

Here is the relevant code in cellForRowAtIndexPath:

//Set font and style        
cell.textLabel.backgroundColor = [UIColor clearColor];
cell.detailTextLabel.backgroundColor = [UIColor clearColor];    

// Assign our own background image for the cell
UIImage *cellBackgroundImage = [UIImage imageNamed:@"Chat.png"];

UIImageView *cellBackgroundImageView = [[UIImageView alloc] initWithImage:cellBackgroundImage];
//[cellBackgroundImageView setBounds:CGRectMake(0, 0, 20, 20)];
//[cellBackgroundImageView setImage:cellBackgroundImage];

//cellBackgroundImageView.frame = CGRectMake(cellBackgroundImageView.frame.origin.x,         cellBackgroundImageView.frame.origin.y, 20, 20);
//cellBackgroundImageView.bounds = CGRectMake(cellBackgroundImageView.frame.origin.x, cellBackgroundImageView.frame.origin.y, 0, 0);
cellBackgroundImageView.contentMode = UIViewContentModeScaleAspectFill;

cellBackgroundImageView.image = cellBackgroundImage;
cell.backgroundView = cellBackgroundImageView;

Any help would be appreciated.

Zeeshan Zeeshan · Accepted Answer · 2014-01-09T19:11:13

Don't do it here, I did it by writing frame of image and label in LayoutSubviews method in custom cell class.

Just -(void)layoutSubviews { setframe: for both UI components }

Overlay textLabel and UIImageView in UITableViewCell

2 Answers