How to crop an image to pieces programmatically

Question

I need to split the image into 9 parts programmatically. Any suggestions on how to do this?

Answer 1

The code below is also a solution that detects the part of the image that was clicked. The idea is to take a UIImage and use CGImageCreateWithImageInRect to crop the shapes. From the cropped part, create a new UIImage and place it in the UIImageView. In order to make the tap gesture work, I had to place the UIImageView in a UIView. Finally, specify a gesture and a unique tag so that the fragment can be identified when clicked.

- (void)loadView { UIView* root = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] applicationFrame]]; UIImage* whole = [UIImage imageNamed:@"whole.jpg"]; //I know this image is 300x300 int partId = 0; for (int x=0; x<=200; x+=100) { for(int y=0; y<=200; y+=100) { CGImageRef cgImg = CGImageCreateWithImageInRect(whole.CGImage, CGRectMake(x, y, 100, 100)); UIImage* part = [UIImage imageWithCGImage:cgImg]; UIImageView* iv = [[UIImageView alloc] initWithImage:part]; UIView* sView = [[UIView alloc] initWithFrame:CGRectMake(200-x, 200-y, 100, 100)]; [sView addSubview:iv]; [iv release]; UITapGestureRecognizer* tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tap:)]; tap.numberOfTapsRequired = 1; [sView addGestureRecognizer:tap]; [tap release]; sView.tag = partId; [root addSubview:sView]; [sView release]; partId++; CGImageRelease(cgImg); } } self.view = root; } - (void)tap:(UITapGestureRecognizer*)gesture { NSLog(@"image tap=%d", gesture.view.tag); } 

Answer 2

There are many ways to cut and cut an image, but here is one. It uses quartz to cut an image into 9 fractions of equal size. Please note that it does not process rotated images (this means images with the image Orientation! = 0), but it should start with you:

 +(NSArray *)splitImageInTo9:(UIImage *)im{ CGSize size = [im size]; NSMutableArray *arr = [[NSMutableArray alloc] initWithCapacity:9]; for (int i=0;i<3;i++){ for (int j=0;j<3;j++){ CGRect portion = CGRectMake(i * size.width/3.0, j * size.height/3.0, size.width/3.0, size.height/3.0); UIGraphicsBeginImageContext(portion.size); CGContextRef context = UIGraphicsGetCurrentContext(); CGContextScaleCTM(context, 1.0, -1.0); CGContextTranslateCTM(context, 0, -portion.size.height); CGContextTranslateCTM(context, -portion.origin.x, -portion.origin.y); CGContextDrawImage(context,CGRectMake(0.0, 0.0,size.width, size.height), im.CGImage); [arr addObject:UIGraphicsGetImageFromCurrentImageContext()]; UIGraphicsEndImageContext(); } } return [arr autorelease]; } 

The output will be an array of 9 images of each size (s / 3, height / 3)

Answer 3

The following parameter-based code snippet image adds borders and displays:

 -(NSMutableArray *)getImagesFromImage:(UIImage *)image withRow:(NSInteger)rows withColumn:(NSInteger)columns{ NSMutableArray *images = [NSMutableArray array]; CGSize imageSize = image.size; CGFloat xPos = 0.0, yPos = 0.0; CGFloat width = imageSize.width/rows; CGFloat height = imageSize.height/columns; for (int y = 0; y < columns; y++) { xPos = 0.0; for (int x = 0; x < rows; x++) { CGRect rect = CGRectMake(xPos, yPos, width, height); CGImageRef cImage = CGImageCreateWithImageInRect([image CGImage], rect); UIImage *dImage = [[UIImage alloc] initWithCGImage:cImage]; UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(x*width, y*height, width, height)]; [imageView setImage:dImage]; [imageView.layer setBorderColor:[[UIColor blackColor] CGColor]]; [imageView.layer setBorderWidth:1.0]; [self.view addSubview:imageView]; [images addObject:dImage]; xPos += width; } yPos += height; } return images; } 

Link for downloading the project: https://github.com/bpolat/Image-Slicer

Example use and result:

[self getImagesFromImage: [UIImage imageNamed: @ "1.png"] withRow: 4 withColumn: 4];

Answer 4

If you want the parts of the image to be organized, you need to use some UIImageView in the final view .. just take a look at this code:

  UIImage* whole = [UIImage imageNamed:@"permanent_cosmetics_pretty.jpg"]; int partId = 0; for (int x=0; x<=300; x+=100) { for(int y=0; y<=300; y+=100) { CGImageRef cgImg = CGImageCreateWithImageInRect(whole.CGImage, CGRectMake(x, y, 100, 100)); UIImage* part = [UIImage imageWithCGImage:cgImg]; UIImageView* iv = [[UIImageView alloc] initWithImage:part]; switch (partId) { case 0: self.part1.image=iv.image; break; case 1: self.part2.image=iv.image; break; case 2: self.part3.image=iv.image; break; case 3: self.part4.image=iv.image; break; case 4: self.part5.image=iv.image; break; case 5: self.part6.image=iv.image; break; case 6: self.part7.image=iv.image; break; case 7: self.part8.image=iv.image; break; case 8: self.part9.image=iv.image; break; case 9: self.part10.image=iv.image; break; case 10: self.part11.image=iv.image; break; case 11: self.part12.image=iv.image; break; default: break; } [iv release]; partId++; NSLog(@"part id = %d",partId); } } [self.view addSubview:self.finalView];