Cut a UIImage into a circle
Cut a image into a circle - Objective C
Section titled “Cut a image into a circle - Objective C”import #include <math.h>
The code in the viewDidLoad or loadView should look something look something like this
- (void)loadView{[super loadView];UIImageView *imageView=[[UIImageView alloc]initWithFrame:CGRectMake(0, 50, 320, 320)];[self.view addSubview:imageView];UIImage *image=[UIImage imageNamed:@"Dubai-Photos-Images-Travel-Tourist-Images-Pictures-800x600.jpg"];imageView.image=[self circularScaleAndCropImage:[UIImage imageNamed:@"Dubai-Photos-Images-Travel-Tourist-Images-Pictures-800x600.jpg"] frame:CGRectMake(0, 0, 320, 320)];}Finally the function which does the heavy lifting circularScaleAndCropImage is as defined below
- (UIImage*)circularScaleAndCropImage:(UIImage*)image frame:(CGRect)frame { // This function returns a newImage, based on image, that has been: // - scaled to fit in (CGRect) rect // - and cropped within a circle of radius: rectWidth/2
//Create the bitmap graphics context UIGraphicsBeginImageContextWithOptions(CGSizeMake(frame.size.width, frame.size.height), NO, 0.0); CGContextRef context = UIGraphicsGetCurrentContext();
//Get the width and heights CGFloat imageWidth = image.size.width; CGFloat imageHeight = image.size.height; CGFloat rectWidth = frame.size.width; CGFloat rectHeight = frame.size.height;
//Calculate the scale factor CGFloat scaleFactorX = rectWidth/imageWidth; CGFloat scaleFactorY = rectHeight/imageHeight;
//Calculate the centre of the circle CGFloat imageCentreX = rectWidth/2; CGFloat imageCentreY = rectHeight/2;
// Create and CLIP to a CIRCULAR Path // (This could be replaced with any closed path if you want a different shaped clip) CGFloat radius = rectWidth/2; CGContextBeginPath (context); CGContextAddArc (context, imageCentreX, imageCentreY, radius, 0, 2*M_PI, 0); CGContextClosePath (context); CGContextClip (context);
//Set the SCALE factor for the graphics context //All future draw calls will be scaled by this factor CGContextScaleCTM (context, scaleFactorX, scaleFactorY);
// Draw the IMAGE CGRect myRect = CGRectMake(0, 0, imageWidth, imageHeight); [image drawInRect:myRect];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext();
return newImage;}SWIFT 3 Example
Section titled “SWIFT 3 Example”override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view, typically from a nib. let imageView = UIImageView(frame: CGRect(x: CGFloat(0), y: CGFloat(50), width: CGFloat(320), height: CGFloat(320))) view.addSubview(imageView) let image = UIImage(named: "Dubai-Photos-Images-Travel-Tourist-Images-Pictures-800x600.jpg") imageView.image = circularScaleAndCropImage(UIImage(named: "Dubai-Photos-Images-Travel-Tourist-Images-Pictures-800x600.jpg")!, frame: CGRect(x: CGFloat(0), y: CGFloat(0), width: CGFloat(100), height: CGFloat(100))) }Finally the function which does the heavy lifting circularScaleAndCropImage is as defined below
func circularScaleAndCropImage(_ image: UIImage, frame: CGRect) -> UIImage{ // This function returns a newImage, based on image, that has been: // - scaled to fit in (CGRect) rect // - and cropped within a circle of radius: rectWidth/2 //Create the bitmap graphics context UIGraphicsBeginImageContextWithOptions(CGSize(width: CGFloat(frame.size.width), height: CGFloat(frame.size.height)), false, 0.0) let context: CGContext? = UIGraphicsGetCurrentContext() //Get the width and heights let imageWidth: CGFloat = image.size.width let imageHeight: CGFloat = image.size.height let rectWidth: CGFloat = frame.size.width let rectHeight: CGFloat = frame.size.height //Calculate the scale factor let scaleFactorX: CGFloat = rectWidth / imageWidth let scaleFactorY: CGFloat = rectHeight / imageHeight //Calculate the centre of the circle let imageCentreX: CGFloat = rectWidth / 2 let imageCentreY: CGFloat = rectHeight / 2 // Create and CLIP to a CIRCULAR Path // (This could be replaced with any closed path if you want a different shaped clip) let radius: CGFloat = rectWidth / 2 context?.beginPath() context?.addArc(center: CGPoint(x: imageCentreX, y: imageCentreY), radius: radius, startAngle: CGFloat(0), endAngle: CGFloat(2 * Float.pi), clockwise: false) context?.closePath() context?.clip() //Set the SCALE factor for the graphics context //All future draw calls will be scaled by this factor context?.scaleBy(x: scaleFactorX, y: scaleFactorY) // Draw the IMAGE let myRect = CGRect(x: CGFloat(0), y: CGFloat(0), width: imageWidth, height: imageHeight) image.draw(in: myRect) let newImage: UIImage? = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return newImage! }