IOS: create a circle with a background color, such as an iPhone calendar list

Question

I am trying to add a circle to the left of my table cells, but cannot figure out how to do this. I tried adding

CGContextRef context= UIGraphicsGetCurrentContext(); CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor); CGContextSetAlpha(context, 0.5); CGContextFillEllipseInRect(context, CGRectMake(10.0, 10.0, 10.0, 10.0)); CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor); CGContextStrokeEllipseInRect(context, CGRectMake(10.0, 10.0, 10.0, 10.0)); 

for my cellForRowAtIndexPath, but kept getting invalid context errors. Here is my cellForRowAtIndexPath.

 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *CellIdentifier = @"AppointmentCell"; NSDictionary *appointment = [[self.appointments objectAtIndex:indexPath.section] objectAtIndex:indexPath.row]; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier]; int minutes = (int)[[NSString stringWithFormat:@"%@", [appointment objectForKey:@"start_time"]] integerValue]; if (cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellIdentifier]; } NSDateFormatter *dateFormatter = [[NSDateFormatter alloc]init]; [dateFormatter setDateFormat:@"h:mma"]; [dateFormatter setTimeZone:[NSTimeZone timeZoneWithAbbreviation:@"GMT"]]; NSDate *midnight = [NSDate dateWithTimeIntervalSince1970:0]; NSDate *newDate = [midnight dateByAddingTimeInterval:minutes*60]; NSString *newTime = [dateFormatter stringFromDate:newDate]; dateFormatter = nil; cell.textLabel.text = newTime; cell.detailTextLabel.textAlignment = UITextAlignmentCenter; cell.detailTextLabel.text = [appointment objectForKey:@"reason"]; return cell; } 

How would I add a circle with a color similar to the iPhone calendar list view?

Answer 1

UPDATED

Your circle rendering code is fine, you just need to put it in a subclass of Sub UIView for it to work properly.

 @interface CircleView : UIView{ } @implementation CircleView{ - (void)drawRect:(CGRect)rect{ CGContextRef context= UIGraphicsGetCurrentContext(); CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor); CGContextSetAlpha(context, 0.5); CGContextFillEllipseInRect(context, CGRectMake(0,0,self.frame.size.width,self.frame.size.height)); CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor); CGContextStrokeEllipseInRect(context, CGRectMake(0,0,self.frame.size.width,self.frame.size.height)); } } 

Then you can add a circle to the table cell,

 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { //... //Your existing code CGRect positionFrame = CGRectMake(10,10,10,10); CircleView * circleView = [[CircleView alloc] initWithFrame:positionFrame]; [cell.contentView addSubview:circleView]; [circleView release]; return cell; } 

Play with the position frame until it matches what you need.

Answer 2

tableView:cellForRowAtIndexPath: is where cells are created, but this is not where drawing is done. If you want to make a custom drawing in tableViewCell, you need to subclass UITableViewCell , override drawRect: and put the drawing code there.

Alternatively, you can set the imageView UIImage image to a ViewCell table to a circle image.