Adding and Saving a Border Around a UIImage with Core Graphics
I recently had to place a border around an image of unknown size and save it back as an image. Here is how:
Start with a UIImage:

Run it through this method:
- (UIImage *)addBorderToImage:(UIImage *)image { | |
CGImageRef bgimage = [image CGImage]; | |
float width = CGImageGetWidth(bgimage); | |
float height = CGImageGetHeight(bgimage); | |
// Create a temporary texture data buffer | |
void *data = malloc(width * height * 4); | |
// Draw image to buffer | |
CGContextRef ctx = CGBitmapContextCreate(data, | |
width, | |
height, | |
8, | |
width * 4, | |
CGImageGetColorSpace(image.CGImage), | |
kCGImageAlphaPremultipliedLast); | |
CGContextDrawImage(ctx, CGRectMake(0, 0, (CGFloat)width, (CGFloat)height), bgimage); | |
//Set the stroke (pen) color | |
CGContextSetStrokeColorWithColor(ctx, [UIColor greenColor].CGColor); | |
//Set the width of the pen mark | |
CGFloat borderWidth = (float)width*0.05; | |
CGContextSetLineWidth(ctx, borderWidth); | |
//Start at 0,0 and draw a square | |
CGContextMoveToPoint(ctx, 0.0, 0.0); | |
CGContextAddLineToPoint(ctx, 0.0, height); | |
CGContextAddLineToPoint(ctx, width, height); | |
CGContextAddLineToPoint(ctx, width, 0.0); | |
CGContextAddLineToPoint(ctx, 0.0, 0.0); | |
//Draw it | |
CGContextStrokePath(ctx); | |
// write it to a new image | |
CGImageRef cgimage = CGBitmapContextCreateImage(ctx); | |
UIImage *newImage = [UIImage imageWithCGImage:cgimage]; | |
CFRelease(cgimage); | |
CGContextRelease(ctx); | |
// auto-released | |
return newImage; | |
} |
You will get back a UIImage with a border. Simple.

Obviously, you will need to adjust the border percentage and color for your own application.
Was this page helpful for you? Buy me a slice of 🍕 to say thanks!
Comments