Adding a text or drawing to the uitableviewcell - ios

Question

I have code that adds a text label, a subtitle and the accessory icon like so:
cell.textLabel.text = #"Title";
cell.detailTextLabel.text = #"Subtitle";
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
// And I see code in the docs for an image:
cell.imageView.image = ...
But I want the place where the image goes (on the left) to be a text or lablel (like in Instagram) or a draw circle (like the Apple favorites call screen). How is this done?

Answer 1

Although with UITableViewCellStyleDefault you get imageView property on UITableViewCell for free and you can use it, just in case, you want to have fine control on placement of imageView and labels on cell, you need to go for custom UITableViewCell. Here are the steps on how to achieve this:
Step 1 : Create a new UITableViewCell subclass say MyCustomCell.
#interface MyCustomCell : UITableViewCell
Step 2 : Implement initWithStyle:reuseIdentifier: method in MyCustomCell.m and add any custom view to cell content view.
- (id)initWithStyle:(UITableViewCellStyle)iStyle reuseIdentifier:(NSString *)iReuseIdentifier {
if ((self = [super initWithStyle:iStyle reuseIdentifier:iReuseIdentifier])) {
MyView *myCustomView = [[MyView alloc] init];
myCustomView.frame = CGRectMake(6.0f, 6.0f, 30.0f, 30.0f);
[self.contentView addSubview:myCustomView];
}
return self;
}
Step 3 : Implement layoutSubviews method to have fine control on your cell content subviews.
- (void)layoutSubviews {
[super layoutSubviews];
self.imageView.frame = CGRectMake(6.0f, 6.0f, 30.0f, 30.0f);
GFloat textLabelXPosition = self.imageView.frame.origin.x + self.imageView.frame.size.width + 10;
self.textLabel.frame = CGRectMake(textLabelXPosition, 0.0, contentRect.size.width - textLabelXPosition, contentRect.size.height);
}
Step 4 : Finally use MyCustomCell instance in you table view controller's cellForRowAtIndexPath: method.

Answer 2

create an imageView image, and then add following lines to your cellForRowAtIndexPath
CGRect newFrame;
newFrame.origin.x = self.accessoryView.frame.origin.x;
newFrame.origin.y = self.accessoryView.frame.origin.y;
self.image.frame= newFrame;
this will give you the access to coordinates of accessory view. Now override with your text/ label.
create A label in your xib - yourLabel
self.yourLabel.frame= newFrame;