UIImage with smooth rounded corners in quartz

Question

I am just testing the following code to round corners on UIImage:

- (UIImage *)makeRoundedImage:(UIImage *)image radius:(float)radius;
{
    CALayer *imageLayer = [CALayer layer];
    imageLayer.frame = CGRectMake(0, 0, image.size.width, image.size.height);
    imageLayer.contents = (id) image.CGImage;

    imageLayer.masksToBounds = YES;
    imageLayer.cornerRadius = radius;

    UIGraphicsBeginImageContext(image.size);
    [imageLayer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *roundedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return roundedImage;
}

I looks fine unless you look closely to generated image. Corners are not smooth. How can I make corners to be smoother/softer ?

EDIT:

Processed image with rounded corners in quartz:

enter image description here

Like you can see corner is not smooth.

This is version with UIImageView's cornerRadius that is much more smoother.

enter image description here

Where is the catch ?

Could you post what image you are trying to crop and what's the result? — Ismael, Dec 28 '12 at 15:01
I do not want to apply rounded corner to a UIImageView cos I want to save this image to filesystem. — Borut Tomazin, Dec 28 '12 at 16:04
Change UIGraphicsBeginImageContext, to UIGraphicsBeginImageContextWithOptions(image.size, NO, [[UIScreen mainScreen] scale]); — Lefteris, Dec 28 '12 at 17:14
@Lefteris: It works! Thanks man! You just saved me from suffering... :) — Borut Tomazin, Dec 28 '12 at 17:17
UIGraphicsBeginImageContextWithOptions(image.size, NO, 0); would have the same effect — tiguero, Dec 28 '12 at 17:25
You are right: The scale factor to apply to the bitmap. If you specify a value of 0.0, the scale factor is set to the scale factor of the device’s main screen. — Borut Tomazin, Dec 28 '12 at 17:29

Jeepston · Accepted Answer · 2013-08-08T11:48:15.923

5

Here is UIImage category:

- (UIImage *) imageWithRoundedCornersRadius: (float) radius
{
    // Begin a new image that will be the new image with the rounded corners
    UIGraphicsBeginImageContextWithOptions(self.size, NO, 0);

    // Add a clip before drawing anything, in the shape of an rounded rect
    CGRect rect = CGRectMake(0, 0, self.size.width, self.size.height);
    [[UIBezierPath bezierPathWithRoundedRect:rect cornerRadius:radius] addClip];

    // Draw your image
    [self drawInRect:rect];

    // Get the image, here setting the UIImageView image
    UIImage *roundedImage = UIGraphicsGetImageFromCurrentImageContext();

    // Lets forget about that we were drawing
    UIGraphicsEndImageContext();

    return roundedImage;
}

edited Aug 08 '13 at 11:48

answered Dec 28 '12 at 15:37

Jeepston

1,361
7
7

I've also tried this but it's the same. Question has been updated with example. Please take a look... – Borut Tomazin Dec 28 '12 at 16:24
3

You should update your answer with this: UIGraphicsBeginImageContextWithOptions(self.size, NO, 0.0); – Borut Tomazin Dec 29 '12 at 20:36

UIImage with smooth rounded corners in quartz

1 Answers1

Linked