Perex19
Perex19

Reputation: 354

custom UITableViewCell not occupying the full bound of the cell?

I was doing this tutorial and I couldn't get the results I wanted, in a part of it.

I subclassed the UITableViewCell and customized the cell directly because I wanted to add a gradient effect to each cell. Basically, I added gradient effect at the top and bottom of each cell.

Here is the code I have used for it:

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
        // add a layer that overlays the cell adding a subtle gradient effect
        gradientLayer = [CAGradientLayer layer];
        gradientLayer.frame = self.bounds;
        gradientLayer.colors = @[(id)[[UIColor colorWithWhite:1.0f alpha:0.2f] CGColor],
        (id)[[UIColor colorWithWhite:1.0f alpha:0.1f] CGColor],
        (id)[[UIColor clearColor] CGColor],
        (id)[[UIColor colorWithWhite:0.0f alpha:0.1f] CGColor]];
        gradientLayer.locations = @[@0.00f, @0.01f, @0.95f, @1.00f];
        [self.layer insertSublayer:gradientLayer atIndex:0];
    }
    return self;
}
-(void) layoutSubviews{
   [super layoutSubviews];

   //ensure that gradient layers occupy the full bounds
   gradientLayer.frame = self.bounds;
}

As a desired result, I want to see the gradientLayer occupying the full bounds of the cell. However, it only occupies like 1mm from the start and end of the cell. So, its not occupying the full bounds.

If I comment out the [super layoutSubviews] it shows the full gradient, which occupies the full bounds of the cell. But this time, it doesn't show the texts inside the cells.

I couldn't solved it. Any help appreciated.

Upvotes: 0

Views: 304

Answers (2)

bert
bert

Reputation: 1596

The comments below showed that the problem looked like this

this

And the solution was to set the background of the cell to the clear color.

Upvotes: 1

Tarek
Tarek

Reputation: 2392

The correct way to do this is to use self.contentView.frame as follows:

gradientLayer.frame = self.contentView.frame;

Upvotes: 0

Related Questions