2013-02-20 31 views
2

我有一个界面,可以让您在一个圆圈内定位图像,然后当您决定将它放在正确的位置时,按下裁切按钮并裁切可见区域图片。如何在一个圆圈内定位和裁剪UIImage

结构上我有一个视图,它包含一个包含UIImageView的滚动视图。 第一个视图图层具有一个形状图层作为形状为圆形的蒙版。这是我的初始化代码。

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 


_buttonView = [[UIView alloc]initWithFrame:CGRectMake(0, self.view.height - 136, 320, 136)]; 

[_buttonView setBackgroundColor:[UIColor whiteColor]]; 
_saveButton = [UIButton buttonWithType:UIButtonTypeCustom]; 
[_saveButton setTitle:@"Save image" forState:UIControlStateNormal]; 
[_saveButton setBackgroundImage:[[UIImage imageNamed:@"cntnt-button-defult-dark-grey.png"] resizableImageWithNormalCapInsets] forState:UIControlStateNormal]; 
[_saveButton addTarget:self action:@selector(saveImageWasPressed:) forControlEvents:UIControlEventTouchUpInside]; 
[_saveButton setBackgroundImage:[[UIImage imageNamed:@"cntnt-button-pressed-dark-grey.png"] resizableImageWithNormalCapInsets] forState:UIControlStateHighlighted]; 
[_saveButton setFrame:CGRectMake(10, 11, 300, 50)]; 
[_buttonView addSubview:_saveButton]; 


_cancelButton = [UIButton buttonWithType:UIButtonTypeCustom]; 
[_cancelButton setTitle:@"CANCEL" forState:UIControlStateNormal]; 
[_cancelButton setBackgroundImage:[[UIImage imageNamed:@"btm-button-defult-grey.png"] resizableImageWithNormalCapInsets] forState:UIControlStateNormal]; 
[_cancelButton setBackgroundImage:[[UIImage imageNamed:@"btm-button-pressed-grey.png"] resizableImageWithNormalCapInsets] forState:UIControlStateHighlighted]; 
[_cancelButton setFrame:CGRectMake(10, _saveButton.bottom+7, 300, 50)]; 
[_buttonView addSubview:_cancelButton]; 


[self.view addSubview:_buttonView]; 

_topView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, _buttonView.yOrigin)]; 
[self.view addSubview:_topView]; 


_scrollView = [[UIScrollView alloc]initWithFrame:_topView.bounds]; 
[self.topView addSubview:_scrollView]; 
[_scrollView setDecelerationRate:0.0]; 


_imageView = [[UIImageView alloc]initWithFrame:CGRectZero]; 
[_scrollView addSubview:_imageView]; 


UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(10, (self.topView.height - 300)/2, 300, 300)]; 
_imageOverlay = [CAShapeLayer layer]; 
[_imageOverlay setPath:path.CGPath]; 
[_imageOverlay setFrame:CGRectMake(0, 0, 320, 320)]; 
[_topView.layer setMask:_imageOverlay]; 

[_imageView setImage:[UIImage imageNamed:@"portrait.jpg"]]; 
[_imageView setSize:_imageView.image.size]; 
[_scrollView setContentOffset:_imageView.center]; 
[_scrollView setContentSize:_imageView.image.size]; 



} 

当“_saveButton”按我希望要裁剪的图像,其中_imageOverlay的可见部分。

如果您对上述有任何疑问,请随时询问。 你能帮我吗?

回答

0

一旦你裁剪你为了圆(以下renderingView):

-(UIImage *)retrieveSingletonImage:(UIView *)renderingView 
{ 
    UIGraphicsBeginImageContextWithOptions(renderingView.bounds.size, renderingView.opaque, 0.0); 

    [renderingView.layer renderInContext: UIGraphicsGetCurrentContext()]; 
    UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext(); 

    UIGraphicsEndImageContext(); 
    return viewImage; 
} 

使用QuartzCore在renderingView层圆角半径,使其圆(直径/ 2 =角落)

+0

我想我明白了,但是我应该将哪个视图作为参数传递给哪个视图?请记住我上面给出的结构。干杯! – 2013-02-20 17:08:47

+0

renderingView在我的代码可能是you_ImageOverlay(我认为)。所以_imageOverlay.layer.cornerRadius = whatever,然后调用我的代码。 – Eric 2013-02-20 17:14:14

0

我发现一些网上做的工作的片段。 首先我代表我的圆形覆盖

- (UIImage *)getCroppedImage 
{ 
    float zoomScale = 1.0/[_scrollView zoomScale]; 
    CGRect rect; 
    rect.origin.x = [_scrollView contentOffset].x * zoomScale; 
    rect.origin.y = [_scrollView contentOffset].y * zoomScale; 
    rect.size.width =_imageOverlay.bounds.size.width *zoomScale; 
    rect.size.height =_imageOverlay.bounds.size.height *zoomScale; 

    CGImageRef cr = CGImageCreateWithImageInRect([[_imageView image] CGImage], rect); 
    UIImage *cropped = [UIImage imageWithCGImage:cr]; 
    CGImageRelease(cr); 
    return [cropped roundedCornerImage:150 borderSize:0]; 
} 

然后返回之前我圆了图像的角落,再裁剪矩形裁剪图像。

@implementation UIImage (RoundedCorner) 

// Creates a copy of this image with rounded corners 
// If borderSize is non-zero, a transparent border of the given size will also be added 
// Original author: Björn Sållarp. Used with permission. See: http://blog.sallarp.com/iphone-uiimage-round-corners/ 
- (UIImage *)roundedCornerImage:(NSInteger)cornerSize borderSize:(NSInteger)borderSize { 
    // If the image does not have an alpha layer, add one 
    UIImage *image = [self imageWithAlpha]; 

    CGFloat scale = [[UIScreen mainScreen] scale]; 
    UIGraphicsBeginImageContextWithOptions(image.size, !image.hasAlpha, 0); 

    // Build a context that's the same dimensions as the new size 
    CGContextRef context = UIGraphicsGetCurrentContext(); 
    CGContextTranslateCTM(context, 0, image.size.height); 
    CGContextScaleCTM(context, 1.0, -1.0); 

    // Create a clipping path with rounded corners 
    CGContextBeginPath(context); 
    [self addRoundedRectToPath:CGRectMake(borderSize, borderSize, image.size.width - borderSize * 2, image.size.height - borderSize * 2) 
         context:context 
        ovalWidth:cornerSize * scale 
        ovalHeight:cornerSize * scale]; 
    CGContextClosePath(context); 
    CGContextClip(context); 

    // Draw the image to the context; the clipping path will make anything outside the rounded rect transparent 
    CGContextDrawImage(context, CGRectMake(0, 0, image.size.width, image.size.height), image.CGImage); 

    // Create a CGImage from the context 
    UIImage *roundedImage = UIGraphicsGetImageFromCurrentImageContext(); 

    UIGraphicsEndImageContext(); 

    return roundedImage; 
} 

@end