How to fit image in irregular shape frame - iphone

Question

I have a problem regarding irregular shape. I searched a lot but nothing was useful for me. I have a number of frames of irregular shape and each frame is again divided into sub areas. I want to fit images from photo library in each sub areas of frame. But i am unable to get location of each sub areas and since shape is also irregular so again another problem to fit image in that area. Can anyone help me !! This is an example of that frame.

Answer 1

You can never have irregular shaped frames. Frames will always in rect shape.
You can have it done by detecting transparent areas.
Refer this link. It will give you idea how to do that :)

Answer 2

Do you want to clip the various images by the arc of the circle? For example, here is a screen snapshot with four images (just random images I got from a search for dogs on http://images.google.com):
And here are the same four images cropped by a circle (or more accurately, each of the four images were separately cropped by the same circle path):
Here is the code that does that
- (UIImage *)cropImage:(UIImage *)image locatedAt:(CGRect)imageFrame byCircleAt:(CGPoint)center withRadius:(float)radius
{
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef context = CGBitmapContextCreate(NULL, imageFrame.size.width, imageFrame.size.height, 8, 4 * imageFrame.size.width, colorSpace, kCGImageAlphaPremultipliedFirst);
CGContextBeginPath(context);
CGRect ellipseFrame = CGRectMake(center.x - imageFrame.origin.x - radius, imageFrame.size.height - (center.y - imageFrame.origin.y - radius) - radius * 2.0, radius * 2.0, radius * 2.0);
CGContextAddEllipseInRect(context, ellipseFrame);
CGContextClosePath(context);
CGContextClip(context);
CGContextDrawImage(context, CGRectMake(0, 0, imageFrame.size.width, imageFrame.size.height), image.CGImage);
CGImageRef imageMasked = CGBitmapContextCreateImage(context);
CGContextRelease(context);
CGColorSpaceRelease(colorSpace);
UIImage *newImage = [UIImage imageWithCGImage:imageMasked];
CGImageRelease(imageMasked);
return newImage;
}
- (void)addSingleCroppedImage:(UIImage *)image at:(CGRect)imageFrame byCircleAt:(CGPoint)center withRadius:(float)radius
{
UIImage *newImage = [self cropImage:image locatedAt:imageFrame byCircleAt:center withRadius:radius];
UIImageView *imageView = [[UIImageView alloc] initWithFrame:imageFrame];
imageView.image = newImage;
[self.view addSubview:imageView];
}
- (void)addCroppedImages
{
NSString *bundlePath = [[NSBundle mainBundle] resourcePath];
CGPoint center = CGPointMake(self.view.frame.size.width / 2.0, self.view.frame.size.width / 2.0);
float radius = 150.0;
UIImage *dog1 = [UIImage imageWithContentsOfFile:[bundlePath stringByAppendingPathComponent:#"imgres-1.jpg"]];
UIImage *dog2 = [UIImage imageWithContentsOfFile:[bundlePath stringByAppendingPathComponent:#"imgres-2.jpg"]];
UIImage *dog3 = [UIImage imageWithContentsOfFile:[bundlePath stringByAppendingPathComponent:#"imgres-3.jpg"]];
UIImage *dog4 = [UIImage imageWithContentsOfFile:[bundlePath stringByAppendingPathComponent:#"imgres-4.jpg"]];
CGRect frame;
UIImage *currentImage;
// upper left
currentImage = dog1;
frame = CGRectMake(center.x - currentImage.size.width, center.y - currentImage.size.height, currentImage.size.width, currentImage.size.height);
[self addSingleCroppedImage:currentImage at:frame byCircleAt:center withRadius:radius];
// upper right
currentImage = dog2;
frame = CGRectMake(center.x, center.y - currentImage.size.height, currentImage.size.width, currentImage.size.height);
[self addSingleCroppedImage:currentImage at:frame byCircleAt:center withRadius:radius];
// lower left
currentImage = dog3;
frame = CGRectMake(center.x - currentImage.size.width, center.y, currentImage.size.width, currentImage.size.height);
[self addSingleCroppedImage:currentImage at:frame byCircleAt:center withRadius:radius];
// lower right
currentImage = dog4;
frame = CGRectMake(center.x, center.y, currentImage.size.width, currentImage.size.height);
[self addSingleCroppedImage:currentImage at:frame byCircleAt:center withRadius:radius];
}