Saturday, June 8, 2013

UITableViewCell imageView example in Objective C (iOS).


UITableViewCell imageView

Returns the image view of the table cell. (read-only)

@property(nonatomic, readonly, retain) UIImageView *imageView

Discussion of [UITableViewCell imageView]
Returns the image view (UIImageView object) of the table view, which initially has no image set. If an image is set, it appears on the left side of the cell, before any label. UITableViewCell creates the image-view object when you create the cell.

UITableViewCell imageView example.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    NSString *CellIdentifier = @"FriendsCell";

    FriendData * fd = [self.friendsDataSource_ objectAtIndex:indexPath.row];

    UITableViewCell *cell = (UITableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
    }

    [cell.imageView  setImageWithURL:[NSURL URLWithString:fd.imageUrl_]];
    [cell.imageView setFrame:CGRectMake(0, 0, 30, 30)];
    [cell.textLabel setText:fd.name_];
    return cell;
}

Example of [UITableViewCell imageView].
My solution is to put a placeholder image with the frame size you want.

 UIImage *placeholder = [UIImage imageNamed:@"some_image.png"];
 [cell.imageView setImage:placeholder];
 [cell.imageView setImageWithURL:[NSURL URLWithString:fd.imageUrl_]];

UITableViewCell imageView example.
@interface SizableImageCell : UITableViewCell {}
@end
@implementation SizableImageCell
- (void)layoutSubviews {
    [super layoutSubviews];

    float desiredWidth = 80;
    float w=self.imageView.frame.size.width;
    if (w>desiredWidth) {
        float widthSub = w - desiredWidth;
        self.imageView.frame = CGRectMake(self.imageView.frame.origin.x,self.imageView.frame.origin.y,desiredWidth,self.imageView.frame.size.height);
        self.textLabel.frame = CGRectMake(self.textLabel.frame.origin.x-widthSub,self.textLabel.frame.origin.y,self.textLabel.frame.size.width+widthSub,self.textLabel.frame.size.height);
        self.detailTextLabel.frame = CGRectMake(self.detailTextLabel.frame.origin.x-widthSub,self.detailTextLabel.frame.origin.y,self.detailTextLabel.frame.size.width+widthSub,self.detailTextLabel.frame.size.height);
        self.imageView.contentMode = UIViewContentModeScaleAspectFit;
    }
}
@end

...

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *CellIdentifier = @"Cell";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[SizableImageCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier] autorelease];
        cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
    }

    cell.textLabel.text = ...
    cell.detailTextLabel.text = ...
    cell.imageView.image = ...
    return cell;
}

End of UITableViewCell imageView example article.