Fredlo2010 Fredlo2010 - 1 year ago 73
iOS Question

UITableViewCell image anchored to the top

I am working with a UITable view with custom elements inside and I cannot get the pictures to stay in the location I placed then originally.

I am just following the tutorial from this website Team tree house

This is how my design looks and how it's coming out int he simulator. Note that I am not using Autolayout because the guy in the video said we should not.

Current status

I have tried changing the project to use Autolayout and adding the constrains but that is not working either.

I added some custom code to make sure the controls stays in place but nothing.

This is what my code looks like.


- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

static NSString *CellIdentifier = @"Cell";
EntryCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];

DiaryEntry *entry = [self.fetchResultsController objectAtIndexPath:indexPath];

[cell configureCellItemProperties];
[cell configureCellForEntry:entry];
[cell fixImage];

return cell;

EntryCell.m (only relevant methods)

+ (CGFloat) heightForEntry: (DiaryEntry *) entry {

const CGFloat topMargin = 35.0f;
const CGFloat bottomMargin = 95.0f;
const CGFloat minHeight = 106.0f;

//The actual size of the label devided by 2 otherwise is not going to get it right.
const CGFloat originalLabelWidth = 202.0f;

CGSize constraint = CGSizeMake(originalLabelWidth, CGFLOAT_MAX);
NSStringDrawingOptions options = (NSStringDrawingUsesFontLeading | NSStringDrawingUsesLineFragmentOrigin);
UIFont *font = [UIFont defaultFontMedium];
NSDictionary <NSString *, id> *attributes = @{NSAttachmentAttributeName: font};

CGRect boundingBox = [entry.body boundingRectWithSize:constraint options:options attributes:attributes context:nil];

return MAX(minHeight, (CGRectGetHeight(boundingBox) + topMargin + bottomMargin));


- (void) configureCellItemProperties {

[self.dateLabel setFont:[UIFont defaultFontBoldMedium]];
self.dateLabel.textColor = [UIColor portgoreColor];

[self.bodyLabel setFont:[UIFont defaultFontMedium]];
self.bodyLabel.textColor = [UIColor portgoreColor];
[self.bodyLabel setNumberOfLines:0];
[self sizeToFit];

[self.locationLabel setFont:[UIFont defaultFontMedium]];
self.locationLabel.textColor = [UIColor silverColor];


- (void) configureCellForEntry: (DiaryEntry *)entry {

self.bodyLabel.text = entry.body;
self.locationLabel.text = entry.location;

NSDateFormatter *dateFormatter = [NSDateFormatter defaultWeekMonthDayYear];
NSDate *date = [NSDate];
self.dateLabel.text = [dateFormatter stringFromDate:date];

if (entry.image) {
self.mainImageView.image = [UIImage imageWithData:entry.image];
}else {
self.imageView.image = [UIImage imageNamed:@"icn_noimage"];

if (entry.mood == DiaryEntryMoodGood) {
self.moodImageView.image = [UIImage imageNamed:@"icn_happy"];
} else if (entry.mood == DiaryEntryMoodAverage){
self.imageView.image = [UIImage imageNamed:@"icn_average"];
} else if (entry.mood == DiaryEntryMoodBad) {
self.imageView.image = [UIImage imageNamed:@"icn_bad"];


- (void) fixImage {

CGRect contentBounds = self.contentView.bounds;
CGRect imageFrame = self.imageView.frame;

imageFrame.origin.x = contentBounds.origin.x + 8;
imageFrame.origin.y = contentBounds.origin.y;

self.imageView.frame = imageFrame;


Thanks a lot for the help :)

Answer Source

You're going to kick yourself.


if (entry.image) {
    self.mainImageView.image = [UIImage imageWithData:entry.image];
}else {
    self.imageView.image = [UIImage imageNamed:@"icn_noimage"];

you're setting the cell's imageView image, rather than mainImageView's image in your else statement.

You have the same bug when setting your moodImageView's image too.

Hope that helps!

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download