Draw a simple circle uiimage

Question

I try to make a 20x20 UIImage with a simple blue circle. I try with this function, but the result is a blue circle in a black square. How do I remove the black square around the circle?

Function:

+ (UIImage *)blueCircle {     static UIImage *blueCircle = nil;     static dispatch_once_t onceToken;     dispatch_once(&onceToken, ^{         UIGraphicsBeginImageContextWithOptions(CGSizeMake(20.f, 20.f), YES, 0.0f);         CGContextRef ctx = UIGraphicsGetCurrentContext();         CGContextSaveGState(ctx);          CGRect rect = CGRectMake(0, 0, 20, 20);         CGContextSetFillColorWithColor(ctx, [UIColor cyanColor].CGColor);         CGContextFillEllipseInRect(ctx, rect);          CGContextRestoreGState(ctx);         blueCircle = UIGraphicsGetImageFromCurrentImageContext();         UIGraphicsEndImageContext();      });     return blueCircle; } 

actual result:

Answer 1

Thanks for the Q&A! Swift code as below:

extension UIImage {     class func circle(diameter: CGFloat, color: UIColor) -> UIImage {         UIGraphicsBeginImageContextWithOptions(CGSizeMake(diameter, diameter), false, 0)         let ctx = UIGraphicsGetCurrentContext()         CGContextSaveGState(ctx)          let rect = CGRectMake(0, 0, diameter, diameter)         CGContextSetFillColorWithColor(ctx, color.CGColor)         CGContextFillEllipseInRect(ctx, rect)          CGContextRestoreGState(ctx)         let img = UIGraphicsGetImageFromCurrentImageContext()         UIGraphicsEndImageContext()          return img     } } 

Swift 3 version provided by Schemetrical:

extension UIImage {     class func circle(diameter: CGFloat, color: UIColor) -> UIImage {         UIGraphicsBeginImageContextWithOptions(CGSize(width: diameter, height: diameter), false, 0)         let ctx = UIGraphicsGetCurrentContext()!         ctx.saveGState()          let rect = CGRect(x: 0, y: 0, width: diameter, height: diameter)         ctx.setFillColor(color.cgColor)         ctx.fillEllipse(in: rect)          ctx.restoreGState()         let img = UIGraphicsGetImageFromCurrentImageContext()!         UIGraphicsEndImageContext()          return img     } } 

Answer 2

You need to include alpha channel into your bitmap: UIGraphicsBeginImageContextWithOptions(..., NO, ...) if you want to see what is behind the corners.